CSS 语法 与 XPATH 语法 爬虫HTML解析

CSS 语法

一、元素选择器

 <div>
    <p> 你好 </p>
 </div>
 <div>
    <p> 欢迎 </p>
 </div>

语法：p
含义：代表 HTML 内的全部 p 标签
结果：

<p> 你好 </p>
<p> 欢迎 </p>

二、id 选择器

<div>
    <p id='ni'> 你好 </p>
    <p id='hello'> 欢迎 </p>
</div>

语法：#hello
含义：获取到 id=‘hello’ 的元素
结果：

<p id='hello'> 欢迎 </p>

三、类选择器

<div>
    <div class='school'>
        <p> 你好 </p>
    </div>
    <div name='ok'>
        <a> 欢迎 </a>
    </div>
</div>

语法：.school
含义：获取到 class=‘school’ 的元素
结果：

<div class='school'>
    <p> 你好 </p>
</div>

四、通用选择器

<div>
    <div class='school'>
        <p> 你好 </p>
    </div>
    <div name='ok'>
        <a> 欢迎 </a>
    </div>
</div>

语法： *

含义：获取到 HTML 里面的所有可能存在
结果：

1、
<div>
<div class='school'>
    <p> 你好 </p>
</div>
<div name='ok'>
    <a> 欢迎 </a>
</div>

2、
<div class="school">
    <p> 你好 </p>
</div>

3、
<p> 你好 </p>

4、
<div name='ok'>
    <a> 欢迎 </a>
</div>

5、
<a> 欢迎 </a>

五、分组选择器

<div>
    <div class='school'>
        <p> 你好 </p>
    </div>
    <div name='ok'>
        <a> 欢迎 </a>
    </div>
</div>

语法： p,a
含义：获取到 所有的 p 标签 和 a 标签
结果：

1、
<p> 你好 </p>

2、
<a> 欢迎 </a>

拓展：

包含 title 属性 的所有元素 ： *[title]
选择 所有 href 属性 为 yuanji.com 的 a 元素： a[href='yuanji.com']
选取 所有 href 属性 包含 job 的 a 元素： a[href*='job']
选取 所有 href 属性值 以 http 开头的 a 元素：a[href^='http']
选择 所有 href 属性值 以 .jpg 结尾的 a 元素： a[href$='.jpg']

后代选择器：li em # li 下面的 所有 em 标签

子选择器：h1 > strong # h1 下面的 子标签 第一层元素

相邻兄弟选择器： ul + ol # 对 ul 相邻的 同级 ol 进行操作

内容选择：

:checked 选择被选中的元素
::text 选择 标签内容的文本
::attr(href) 选择标签的 href 元素的值
p~ul 选择p元素之后的每一个ul元素
p:last-child 选择每个p元素是其父级的最后一个子级。
p:empty 选择每个没有任何子级的p元素（包括文本节点）

XPATH 语法

解析样例：
地址: 样例数据来源

<bookstore>
	<book category="children">
		<title lang="en">Harry Potter</title>
		<author>J K. Rowling</author>
		<year>2005</year>
		<price>29.99</price>
	</book>
	<book category="cooking">
		<title lang="en">Everyday Italian</title>
		<author>Giada De Laurentiis</author>
		<year>2005</year>
		<price>30.00</price>
	</book>
	<book category="web" cover="paperback">
		<title lang="en">Learning XML</title>
		<author>Erik T. Ray</author>
		<year>2003</year>
		<price>39.95</price>
	</book>
	<book category="web">
		<title lang="en">XQuery Kick Start</title>
		<author>James McGovern</author>
		<author>Per Bothner</author>
		<author>Kurt Cagle</author>
		<author>James Linn</author>
		<author>Vaidyanathan Nagarajan</author>
		<year>2003</year>
		<price>49.99</price>
	</book>
</bookstore>

一、基础语法

/ 代表根路径 表示绝对路径 从第一个元素开始算起
// 代表相对路径 表示 满足条件的所有情况

. 选取 当前 节点
.. 选取 当前 节点的 父 节点

* 任何所有 类型

数据选择：
/text() 获取 元素标签的文本
//text() 获取 元素标签下的 所有文本
/@href 提取 标签元素的 href 属性的 值

例子：

对下面的 HTML 使用 ：XPATH 语法

<book category="web">
	<title lang="en">XQuery Kick Start</title>
	<author>James McGovern</author>
	<author>Per Bothner</author>
	<author>Kurt Cagle</author>
	<author>James Linn</author>
	<author>Vaidyanathan Nagarajan</author>
	<year>2003</year>
	<price>49.99</price>
</book>

一、
语法： /title
含义： 获取 根路径 下面的 title 标签
结果： 由于 根路径下面 第一层不存在 title 标签，因此 没有结果

二、
语法： /book
含义： 获取 根路径 下的 book 标签
结果：

<book category="web">
	<title lang="en">XQuery Kick Start</title>
	<author>James McGovern</author>
	<author>Per Bothner</author>
	<author>Kurt Cagle</author>
	<author>James Linn</author>
	<author>Vaidyanathan Nagarajan</author>
	<year>2003</year>
	<price>49.99</price>
</book>

三、
语法： //title
含义： 获取 相对路径 下的 所有 title 标签
结果：

<title lang="en">XQuery Kick Start</title>

根据 以上 三种 使用方法可以 了解到简单的 xpath 语法规律

二、XPATH 属性选择器

//*[@class='school'] 选择所有 属性有 class=‘school’ 的标签元素
例子：

对 下面 的 HTML 使用 XPATH 属性 选择器 选取 元素

<book category="web" cover="paperback">
	<title lang="en">Learning XML</title>
	<author>Erik T. Ray</author>
	<year>2003</year>
	<price>39.95</price>
</book>

方法：
语法： //*[@lang='en']
含义： 选择 包含 lang 属性 并且 lang 属性 绝对等于 en 的所有元素
结果：

<title lang="en">Learning XML</title>

拓展：

选择 不包含 class 属性的 span 元素： //span[not(@class)]
选择 不包含 class 和 id 属性的 span 元素： //span[not(@class) and not(@id)]
选择 不包含 class=‘school’ 的 span 元素： //span[not(contains(@class,'school'))]
选择 包含 class=‘school’ 的 span 元素： //span[contains(@class,'school')]

选择 找到的 所有 元素的 第一个 元素： //body/p[1]

第一个 元素 使用 ： [1]
最后一个元素 使用： [last()]
选择 倒数第二个元素 使用 ： [last()-1]
选择 前 两个 元素 使用： [position()<3]
选择 所有 有 class 属性的 元素 ： [@class]

最后，爬虫数据解析时大家都喜欢用哪中语法呀！