爬虫学习笔记——css选择器和XPath定位元素以及lxml库

最新推荐文章于 2025-07-05 14:41:56 发布

梁会计，不识数。

最新推荐文章于 2025-07-05 14:41:56 发布

阅读量1.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏：爬虫笔记文章标签： css selector xpath lxml

本文链接：https://blog.csdn.net/The_accounting/article/details/97928551

这篇博客介绍了如何使用css选择器和XPath定位网页元素，详细讲解了id、class、通配符的查找方法，以及XPath的绝对路径、相对路径和构建有效Xpath的策略。并探讨了lxml库在结合XPath进行网页解析时的应用，包括获取特定标签、属性值和子孙节点等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

查找元素笔记总结自： 慕课网-web端功能自动化定位元素.

css选择器查找元素

id查找元素

语法：
1. tag[attribute='value']
2. "#" --- id
3. "." --- class
示例：
匹配如下节点：
<nav id="nav" class="clearfix">

nav[id=‘nav’]
nav#nav
nav.clearfix

class查找元素

示例：
匹配如下节点：

<div class="csdn-side-toolbar">
<a class="option-box go-top-hide" data-type="gotop">

.csdn-side-toolbar (class包含该字符串的节点)
div.csdn-side-toolbar
div[class=csdn-side-toolbar] （class名必须完全匹配，一个节点有多个class使用这个语法）
追加类： .class1.class2.class3
.option-box.go-top-hide

通配符查找元素

通配符：
1. “^” — 代表以什么文本开始
2. “$” — 代表以什么文本结束
3. “*” — 代表包含什么文本
示例：
a[class^=‘option’]匹配如下节点：

	<a class="option-box" data-type="app">
	<a class="option-box go-top-hide" data-type="gotop">

div[class$=‘clearfix’]匹配如下节点：
<div class="container clearfix">

div[class*=‘row’]匹配如下节点：
<div class="container row center-block ">

查找子节点

匹配下面字段：

<html>
<body data-category="home" data-host_type="www">
	<div class="csdn-side-toolbar"></div>
	<div id="csdn-toolbar" class="csdn-toolbar tb_disnone  csdn-toolbar-skin-black "> </div>
</body>
</html>

html>body>div（结果不唯一）
body>#csdn-toolbar (通过body子节点id定位元素)
body>.csdn-toolbar-skin-black (通过body子节点class定位元素)

XPath定位元素

如果元素的id不唯一，或者是动态的
或者name以及linktext属性值也不唯一
推荐按使用Xpath定位于元素。
语法：//tag[@attribute='value']

绝对路径与相对路径

Xpath中的绝对路径用单斜线"/"，元素是上一级节点的子节点中的一个，不能跳级。
Xpath中的相对路径用双斜线"//"，元素是上一级节点的任何子孙节点中的一个，可以跳级。
路径不要使用"*"，要写明标签名。

如何构建一个有效的Xpath

用Text()

//a[text()=‘收藏’]匹配如下节点：

<a href="//space.bilibili.comt" data-tryxpath-focused="true">收藏</a>

用contains关键字

语法：//tag[contains(attribute,‘value’)]

//a[contains(text(),‘收藏’) and contains(@href, ‘bilibili’)]匹配如下节点：

<a href="//space.bilibili.comt" data-tryxpath-focused="true">收藏</a>

用starts-with关键字

语法：//tag[starts-with(attribute,‘value’)]
示例：//div[@id=‘app’]//div[starts-with(@id, ‘bili’)]匹配如下class="bili-wrapper"的div标签的4个子节点。

<div id="app">
		<div class="bili-wrapper">
			<div id="bili_douga"></div>
			<div id="bili_music"></div>
			<div id="bili_dancee"></div>
			<div id="bili_game"></div>
	</div></div>

查找父节点以及平级节点

父节点：xpath-to-some-lelment//parent::<tag>
找前面的平级节点：xpath-to-some-lelment//preceding-sibling::<tag>(注意：查找前面的平级节点，计数是开始的节点为1，从1往前数2，3，4.···)
后面的平级节点: xpath-to-some-lelment//following-sibling::<tag>

示例：
1.//div[@id=‘bili_game’]//parent::div
2.//div[@id=‘bili_game’]//preceding-sibling::div（三个结果）
3.//div[@id=‘bili_dance’]//following-sibling::div