爬虫基础-网页的基本结构

网页的基本结构

网页是存放在服务器端某个文件夹内的文件，它可以使静态的（可以包含Javascript，但是客户端访问这个网页时，他不是被程序加载出来的，而是像下载某个图片那样下载过来的。这貌似就是以前的网页的通用操作），也可以是动态的。当我们使用Wordpress来创建自己的网站时，里面的网页就都是PHP程序动态加载出来的。

静态网页编写简单加载速度快，但是存在巨大的缺陷，它无法变化更别提和用户互动。动态网页在这种情况下应运而生，它可以实现搜索，查询，登录注册等等诸多好玩的功能

网页可以分为三大部分，即老生常谈的HTML，Javascript，和CSS。

1. HTML是规定了一个页面的总体布局，它既然包含了页面内的所有元素，就必须具有高度的概括性。一个常用的比喻是，它是网页的骨架
2. Css是针对HTML文本内容进行布局和和装饰的，这里说布局意思是它可以更改HTML元素的位置display:float;float:left会产生把一个HTML元素紧贴到它所在父元素的左边框的效果。至于装饰性的效果，不言而喻，就是对文本内容进行美化的，针对字体我们可以选择它们的样式，大小颜色，位置；针对图片，我们可以选择透明度，圆角边框，位置。
3. Javascript是嵌套的写在HTML文本内部的脚本文件，当然也可以作为外部文件进行引用，事实上，CSS文件和它的引用方式相同。对于Javascript，常见的操作是给网页添加轮播图（如果你登录淘宝，马上就可以看到它的身影），和提交表单。因为自己的Javascript学的不咋地，所以叙述可能过于简陋

我们为什么要了解网页的基本结构？

Answer:我们做爬虫，事实上最重要的就是对网页的Response做出分析提取自己想要的数据，当然你也可以不提取，那为什么不直接去人家做好的网站看呢？？（偷笑），当我们了解了网页的基本结构，也就可以更加精准的定位到我们想要的元素的位置。在Python爬虫当中，Xpath，CSS选择器（这都是定位网页元素的方法）就都必须建立在理解网页结构对网页内容的安排方式的基础上。

网页结构和Xpath。

复制一个完整的Xpth路径：/html/body/div[1]/div[1]/div[1]/div/div[3]/button[1]；你看到的是从网页的跟节点层层定位后的路径，你必须理解这些HTML标签之间的逻辑关系，才能准确定位到自己想要的元素注：这是我从开发者工具中copy过来的，通常不这么写，或者说懒得写这么长。

网页结构和CSS选择器

css的选择器用于精准的定位需要修饰的元素，可分为：Class属性选择器，HTML标签选择器，还有ID选择器。这里不做详细的叙述。

注意：Xpath有自己的语法，可以对xml文档和HTML文档内部的内容做出精确的定位，需要自己花时间去了解。

学Xpath这一篇文章就够了