Android中解析html网页

gearss 2016-04-15

展开全文

本文主要记录通过网页解析得到自己想要的数据，也就是一个简单的爬虫。将使用第三方库jsoup实现，通过第三方库，能够快速方便的解析html。在开始之前，需要具备以下能力：

首先，需要对网页编程有一点了解，知道一个页面的结构，标签的含义，知道html网页其实是一种xml格式的文件。如果对这些都了解的话，就可以很方便的进行网页解析了，如果不太熟悉，建议先了解一下网页编程。
然后，在使用第三方库之前，最好是先看一下官方文档：Jsoup官方文档，Jsoup文档中文版

接下来就通过一个具体需求来实现。假设需求是一个Android端的博客浏览器，第一页是博客标题的列表，点击单个标题可以进入第二个页面，第二个页面是一个WebView，通过第一个页面传入的url加载指定博客的网页。以上这个简单的需求，两个页面实现，当然重点是在第一个页面，怎样获取博客标题的列表？

1.分析网页结构

在解析一个网页之前，需要先了解这个网页的结构，在PC端通过浏览器的开发者工具就能很方便的查看网页结构，比如在Chrome中，按F12就可以出现开发者工具。接下来就是分析博客列表页面的结构：
根据需求，我要得到博客标题的列表，于是，在Chrome中，打开指定页面，右键选择某个标题，选择“审查元素”在右边就能看到指定标题的代码：
这里写图片描述

从网页源码中，需要的内容的结构：

  <span class="link_title"><a href="/ttccaaa/article/details/49282851">
        Win10与Ubuntu 15.04双系统安装方法            
        </a></span>1
2
3

一个< span >标签，里面有一个超链接标签< a >，链接指向博客内容的网页，到此，思路就比较清晰了，只需要提取出当前页面中class为“link_title”的< span >标签下的超链接标签< a >的内容即可，然后封装到ListView中，显示到界面，就能实现功能了。

2.配置jsoup

关于jsoup的介绍和使用可以从官网了解到，下面开始配置和使用：

2.1 下载：

首先需要下载jar包，目前最新版是1.8.3,如果只是简单的使用，可以只下载jsoup-1.8.3.jar 官方下载：jsoup下载

2.2 添加依赖：

如同以前的步骤，先将下载的jar包放在libs下，然后对它右键选择“Add As Library”这样就完成了依赖添加。

3. 写代码

根据上面的分析，需要找到文章标题，首先要找到class=”link_title”的< span >标签，然后获取到其中的< a >标签的属性和内容，就是需要的标题和url，所以，第一步，先写一个bean，用来保存title和对应的url：

public class TitleBean {
    private String title;
    private String url;


    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getUrl() {
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

接下来就是把刚才的思路转换成代码：

   private class GetDataThd extends Thread {
        @Override
        public void run() {
            super.run();
            try {
                Document doc = Jsoup.connect(BLOG_URL).get();//通过url获取到网页内容

                Elements elements = doc.getElementsByClass("link_title");//查找所有class为"link_title"的元素
                for (Element e : elements) {
                    Elements titles = e.getElementsByTag("a");//在每一个找到的元素中，查找<a>标签
                    for (Element title : titles) {
                        //将找到的标签数据封装起来
                        TitleBean bean = new TitleBean();
                        bean.setTitle(title.text());//获取标签的内容，也就是文章标题
                        bean.setUrl("http://blog.csdn.net" + title.attr("href"));//获取标签属性，也就是文章链接
                        list.add(bean);
                    }
                }
                msgHandler.sendEmptyMessage(MSG_LOAD_OK);//通知UI更新List
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

在Adapter中，设置点击事件，跳转到详情页面：

   @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.item_title_list, null);
            holder = new ViewHolder();
            holder.tvTitle = (TextView) convertView.findViewById(R.id.tv_item_title);
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }

        TitleBean bean = mList.get(position);
        holder.tvTitle.setText(bean.getTitle());

        holder.tvTitle.setOnClickListener(new ItemClickListener(bean.getUrl()));


        return convertView;
    }

    private class ItemClickListener implements View.OnClickListener {
        private String url;

        public ItemClickListener(String url) {
            this.url = url;
        }

        @Override
        public void onClick(View v) {
            Intent toDetail = new Intent(mContext, DetailActivity.class);
            toDetail.putExtra("detailUrl", url);
            mContext.startActivity(toDetail);
        }
    }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

接下来在详情页面，通过getIntent获取到url，然后用webView加载这个url即可：

 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_detail);

        String url = getIntent().getStringExtra("detailUrl");
        WebView mWebView = (WebView) findViewById(R.id.web_detail);

        mWebView.getSettings().setLoadWithOverviewMode(true);
        mWebView.getSettings().setUseWideViewPort(true);

        mWebView.loadUrl(url);
    }1
2
3
4
5
6
7
8
9
10
11
12
13

运行效果：
这里写图片描述