Any way to hide elements from webview? (android)

Question

There's a webpage I pull up with webview, however i'd like to hide the 1 text link at the top. Is there a way to do this? The link is in the body, so I can't hide the body element in whole. The webpage is all text, and one tiny image at the bottom, but the text is generated each time you load it, so I can't just copy/paste the body.

Thanks

score 26 · Answer 1 · edited Dec 31 '17 at 09:13

26

final WebView webview = (WebView)findViewById(R.id.browser);

    webview.getSettings().setJavaScriptEnabled(true);

    webview.setWebViewClient(new WebViewClient() {
     @Override
    public void onPageFinished(WebView view, String url)
    {
        // hide element by class name
        webview.loadUrl("javascript:(function() { " +
                "document.getElementsByClassName('your_class_name')[0].style.display='none'; })()");
        // hide element by id
        webview.loadUrl("javascript:(function() { " +
                "document.getElementById('your_id').style.display='none';})()");

    }
    });

webview.loadUrl(url);

edited Dec 31 '17 at 09:13

Adharsh M

2,773
2
20
33

answered Aug 06 '15 at 04:23

Linh

433
6
11

5

It should be `"javascript:(function() {document.getElementById('your_id').style.display='none';})()"` (without `[0]`) – 18446744073709551615 Feb 13 '16 at 03:50
I'm using the same code but it does not having any effect on webView – Abhi Soni Jan 23 '17 at 07:58
same here. I cannot even get alert('helllo'); to work. And I have set js enabled to true. – Zapnologica Apr 15 '18 at 18:56
1

It is working in onPageFinished(). Is there any chance to hide the div while loading itself? Thanks in advance – sandeepmaaram May 14 '18 at 09:39
2

@SandeepReddyM why not hide the webview and when till onPageFinish called visible the webview. WebView will show exactly how you want to show to user. – Ashu Kumar Aug 16 '18 at 06:55
But it's taking time to hide the element.Is there any solution to avoid delay while executing the javascript? – user2162130 Sep 01 '20 at 06:42

score 8 · Answer 2 · edited Dec 06 '12 at 05:07

8

I got it! By injecting javascript I had to use

webview.loadUrl("javascript:(function() { " + "document.getElementsByTagName('a')[0].style.display = 'none'; " + "})()");

That removes the link ( code). Replacing ('a') with ('img') would remove the images.

(thanks lexanderA - Injecting JavaScript into a WebView )

edited Dec 06 '12 at 05:07

Cassie

5,223
3
22
34

answered Jun 12 '10 at 21:05

ajent

273
1
2
6

abolfazl bazghandi · Answer 3 · 2019-06-10T07:45:48.437

I use WebViewSuite

and implement this

webViewSuite = findViewById(R.id.webViewSuite);
webViewSuite.startLoading("https://example.com/blog/");

and added customizeClient to WebViewSuite

webViewSuite.customizeClient(new WebViewSuite.WebViewSuiteCallback() {
      @Override
      public void onPageStarted(WebView view, String url, Bitmap favicon) {
      }

      @Override
      public void onPageFinished(WebView view, String url) {
        hideSomeSectionOfBlog(view);
      }

      @Override
      public boolean shouldOverrideUrlLoading(WebView view, String url) {
        return false;
      }
    });

and use function to hide elements

 private void hideSomeSectionOfBlog(WebView view) {
    view.getSettings().setJavaScriptEnabled(true);
    view.loadUrl("javascript:(function() { " +
      "document.getElementById('Top_bar').style.display='none';" +
      "document.getElementById('Filters').style.display='none';" +
      "document.getElementById('Footer').style.display='none';" +
      "document.getElementsByClassName('Header').style.display='none';" +
      "})()");
  }

Hope to be useful

Note: if id not exist JavaScript get error. example if Filters do not exists id ,Footer and Header do not display='none' If you do not trust Separate like this

view.loadUrl("javascript:(function() { " +
      "document.getElementById('Footer').style.display='none';})()");
view.loadUrl("javascript:(function() { " +
      "document.getElementById('Header').style.display='none';})()");

Any way to hide elements from webview? (android)

3 Answers3

Linked