美文网首页
动手学爬虫(1):从熟悉网页结构开始

动手学爬虫(1):从熟悉网页结构开始

作者: 废柴社 | 来源:发表于2016-05-12 22:48 被阅读452次

    爬虫第一课:熟悉网页!

    1.认识网页

    简单来说,网页由三种元素组成:一是html结构:即哪个区域放置哪些内容;二是css样式:即每个区域显示成什么样子;三是script语句(这部分可能和网页内的内容调度有关,暂时不太熟悉)。
    要做爬虫,熟悉网页的html结构是十分必要的。

    作业.png

    上图中的<div></div>,<li></li>等部分即是html中的区域、列表等结构。

    2.模仿写一个网页

    模仿目标如下图:

    目标作业.png

    由于主体直接引用了老师提供的css样式,此部分只需把html结构、填充的内容写清楚即可,完成代码如下:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>The blah</title>
        <link rel="stylesheet" type = "text/css" href = "homework.css">
    </head>
    <body>
        <div class="header">
            <img src= "images/blah.png" >
            <ul class="nav">
                <li><a href="##">Home</a></li>
                <li><a href="www.baidu.com">Site</a></li>
                <li><a href="##">Other</a></li>
            </ul>
        </div>
        <div class="main-content">
            <h2>The Beach</h2>
            <hr />
            <ul class="photos">
                <li>
                    <img src="images/0001.jpg" width="150" height="150">
                </li>
                <li>
                    <img src="images/0002.jpg" width="150" height="150">
                </li>
                <li>
                    <img src="images/0003.jpg" width="150" height="150">
                </li>
            </ul>
            <li>
                Donald Trump's tax plan:
            1. Cut taxes for the wealthiest Americans
            2. Saddle the rest of the country with the debt
            </li>
        </div>
        <div class="footer">
            <p>&copy;feichaishe</p>
        </div>
    </body>
    </html>
    

    最终效果与目标网页一致:

    作业结果.png

    3.总结

    写网页和写爬虫是两个互逆的过程:写一个简单的网页有助于理解网页的结构分布,理解我们平时所见的网页是如何生成的,也就知道我们想要爬取的内容处于网页中的什么位置。

    相关文章

      网友评论

          本文标题:动手学爬虫(1):从熟悉网页结构开始

          本文链接:https://www.haomeiwen.com/subject/baajrttx.html