话题 | 描述 |
---|---|
选择器简介 | XPath 和 CSS 选择器概述。 |
XPath 基础 | XPath 语法、表达式和轴的解释。 |
CSS 选择器基础 | 了解 CSS 选择器、组合器和伪类。 |
XPath 与 CSS 选择器 | XPath 和 CSS 选择器之间的比较,突出优点和缺点。 |
实际例子 | 使用 XPath 和 CSS 选择器进行网页抓取的分步示例。 |
工具和资源 | 用于学习和使用 XPath 和 CSS 选择器的推荐工具和资源。 |
选择器介绍:什么是 XPath 和 CSS 选择器?
XPath 和 CSS 选择器是用于网页抓取的强大工具,可用于定位和提取网页中的元素。对于希望自动收集网络信息(无论是用于研究、商业还是个人项目)的人来说,这些工具都是必不可少的。
XPath 基础
什么是 XPath?
XPath,即 XML 路径语言,是一种查询语言,可用于浏览 XML 文档中的元素和属性。在网页抓取中,XPath 用于定位 HTML 文档中的元素。
XPath 语法和表达式
XPath 表达式用于从 XML 文档中选择节点。以下是一些基本的 XPath 表达式:
- 绝对路径:
/html/body/div
– 选择全部div
元素的子元素身体
元素。 - 相对路径:
//div
– 选择全部div
文档中的元素,无论其位置如何。 - 属性:
//div[@id='main']
– 选择div
元素与ID
属性等于‘main’。 - 文本内容:
//div[text()='Hello World']
– 选择div
包含文本“Hello World”的元素。
XPath 轴
XPath 轴定义节点与当前节点的关系。一些常用的轴是:
- 孩子:
子::div
– 选择全部div
当前节点的子节点。 - 父母:
父级::div
– 如果当前节点是div
. - 兄弟:
以下兄弟::div
– 选择全部div
当前节点之后的兄弟节点。 - 祖先:
祖先::div
– 选择全部div
当前节点的祖先。
CSS 选择器基础
什么是 CSS 选择器?
CSS 选择器是用于选择网页元素的模式。它们主要用于 CSS 样式设置,但也可用于网页抓取以定位元素。
基本 CSS 选择器
- 类型选择器:
div
– 选择全部div
元素。 - 类选择器:
。班级名称
– 选择具有该类的所有元素班级名称
. - ID 选择器:
#id 名称
– 选择具有 id 的元素id 名称
. - 属性选择器:
[类型='文本']
– 选择具有该属性的所有元素类型
设置为‘文本’。
组合器和伪类
- 后代组合器:
分页
– 选择全部页
里面的元素div
元素。 - 子组合器:
div > p
– 选择全部页
直接子元素div
元素。 - 相邻兄弟组合器:
div + p
– 选择页
元素之前紧接着div
元素。 - 通用兄弟组合器:
div ~ p
– 选择全部页
元素前面带有div
元素。 - 伪类:
悬停
– 选择A
当用户将鼠标悬停在元素上时。
XPath 与 CSS 选择器:使用哪一个?
XPath 和 CSS 选择器都有各自的优点和缺点,它们之间的选择通常取决于任务的具体要求。
XPath 的优势
- 强大的:XPath 可以通过 DOM 向前和向后导航,这使得它对于复杂查询非常强大。
- 灵活的:XPath 允许更复杂的表达式和条件,提供更大的灵活性。
XPath 的弱点
- 复杂:语法可能更复杂,对于初学者来说更难学习。
- 表现:与 CSS 选择器相比,XPath 查询速度较慢,尤其是在大型文档中。
CSS 选择器的优势
- 简单:CSS 选择器通常更易于阅读和编写,因此对初学者更加友好。
- 表现:CSS 选择器通常比 XPath 查询更快,尤其是在现代浏览器中。
CSS 选择器的弱点
- 功能有限:与 XPath 相比,CSS 选择器的功能和灵活性较差,特别是对于复杂的查询。
实例:使用 XPath 和 CSS 选择器进行网页抓取
让我们看一些如何使用 XPath 和 CSS 选择器从网页中提取信息的实际例子。
示例 1:从网页中提取标题
使用 XPath:
//h1 | //h2 | //h3
此表达式选择所有 h1
, 氢键
, 和 H3
元素。
使用 CSS 选择器:
H1、H2、H3
此选择器选择所有 h1
, 氢键
, 和 H3
元素。
示例 2:提取具有特定类别的链接
使用 XPath:
//a[@class='特定类']
此表达式选择所有 A
具有类的元素 特定类别
.
使用 CSS 选择器:
a.特定类别
此选择器选择所有 A
具有类的元素 特定类别
.
示例 3:提取包含特定文本的元素
使用 XPath:
//*[包含(text(),'特定文本')]
此表达式选择所有包含文本“特定文本”的元素。
使用 CSS 选择器(不能直接使用 CSS,需要额外的 JavaScript):
/* 无法直接使用 CSS */
工具和资源:学习和使用 XPath 和 CSS 选择器
有几种工具和资源可以帮助您学习和有效地使用 XPath 和 CSS 选择器:
- 浏览器开发工具:大多数现代浏览器都带有内置开发工具,允许您检查元素并测试 XPath 和 CSS 选择器。
- 在线 XPath 评估器:XPath Tester 等网站允许您在线测试 XPath 表达式。
- CSS 选择器测试工具:CSS Diner 等网站提供互动游戏来帮助您学习 CSS 选择器。
- 文档:可以在 W3Schools 和 MDN Web Docs 上找到 XPath 和 CSS 选择器的官方文档。
结论
对于任何参与网页抓取或自动数据提取的人来说,掌握 XPath 和 CSS 选择器都是必不可少的。通过了解这些强大工具的基础知识,您可以准确高效地从网页中定位和提取所需的信息。无论您是初学者还是经验丰富的抓取者,您从学习 XPath 和 CSS 选择器中获得的技能都将对您的网页抓取工具包大有裨益。