Display a part of the webpage on the webview android

I want to make an app which loads the content from the webpage into webview. I want to show only a particular thing in the entire webview, not the whole content of the webpage.

Here is an example. If I use: http://us.m.yahoo.com/w/search%3B_ylt=A2KL8xs0vUBQMg0AwAkp89w4?submit=oneSearch&.intl=us&.lang=en&.tsrc=yahoo&.sep=fp&p=digital+cameras&x=0&y=0 as the URL for the webview, it loads all the contents of the page on the webview. But I want to remove the banner of the page and show it on the webview of my application.

I have tried using adblocker using CSS tags, but that is not helping me. Please give me some idea for overcoming this problem.

Thanks.


Thank You for the answer Zyber. I have solved it using injection of JavaScript in the code for WebView in android.

final WebView webview = (WebView)findViewById(R.id.browser);
webview.getSettings().setJavaScriptEnabled(true);
webview.setWebViewClient(new WebViewClient() {
 @Override
public void onPageFinished(WebView view, String url)
{
    webview.loadUrl("javascript:(function() { " +
            "document.getElementsByTagName('header')[0].style.display="none"; " +
            "})()");
}
});
webview.loadUrl("http://code.google.com/android");

This solved my purpose and it is easy to use to.


I got the solution to add this:

view.getSettings().setJavaScriptEnabled(true);
        view.setWebViewClient(new WebViewClient() {

            @Override
            public void onPageFinished(WebView view, String url)
            {
                view.loadUrl("javascript:(function() { " +
                        "var head = document.getElementsByClassName('header')[0].style.display='none'; " +
                        "var head = document.getElementsByClassName('blog-sidebar')[0].style.display='none'; " +
                        "var head = document.getElementsByClassName('footer-container')[0].style.display='none'; " +
                        "})()");

            }
        });
        view.loadUrl("your url");

Adding (var head =) looks like to hide my class in webview.

I hope this will be helpful for someone.


check Jsoup it provides an library which gives an easy way of extracting Html elements from a webpage

DefaultHttpClient client = new DefaultHttpClient();
HttpGet get = new HttpGet(url.toURI());
HttpResponse resp = client.execute(get);

String content = EntityUtils.toString(resp.getEntity());
Document doc = Jsoup.parse(content);
Elements ele = doc.select("div.classname");

This example executes an Http GET and then extracts an Div element with the class "classname" which you can then load in your webview