xpth和css具体使用

xpath

在这里插入图片描述

在这里插入图片描述

表达式

/ 从跟节点选取
在这里插入图片描述
//从匹配选择的当前节点选择文档中的节点,而不考虑它们的位置
在这里插入图片描述
.选取当前节点
在这里插入图片描述
..选取当前节点的父节点
在这里插入图片描述
@选取属性
在这里插入图片描述
在这里插入图片描述

路径表达式

/bookstore/book[1]选取属于bookstore子元素的第一个book元素
在这里插入图片描述
/bookstore/book[last()]选取属于bookstore子元素的最后一个book元素
在这里插入图片描述
/bookstore/book[last()-1]选取属于bookstore子元素的倒数第二个book元素
在这里插入图片描述
/bookstore/book[position()<3]选取最前面的两个属于bookstore元素的子元素的book元素
在这里插入图片描述
//title[@lang]选取所有拥有名为lang的属性的title元素
在这里插入图片描述
//title[@lang='eng']选取所有拥有名为lang,值为eng,的属性的title元素
在这里插入图片描述

选择未知节点

*匹配任何元素节点
在这里插入图片描述
@*匹配任何属性节点
在这里插入图片描述
node()匹配任何类型的节点
在这里插入图片描述
练习
在这里插入图片描述

选取若干路径

//book/title|//book/price选取book元素的所有title和price元素
在这里插入图片描述
//title|//price选取文档中的所有title和price元素
在这里插入图片描述

补充

//*[text()="xxx"] 内容是xxx的元素
在这里插入图片描述

//*[starts-with(@属性名,"xxx")] 属性以xxx开头的元素
在这里插入图片描述
//*[contains(@属性名,"xxx")] 属性含有xxx的元素
在这里插入图片描述
//*[@attribute1=value1 and @attribute2=value2]同时有两个属性值的元素
在这里插入图片描述

css选择器

在这里插入图片描述

css选择器语法

在这里插入图片描述

.clss

在这里插入图片描述

#id

在这里插入图片描述

标签名

在这里插入图片描述

通过元素之间的嵌套关系

在这里插入图片描述

div,p

在这里插入图片描述

div p

在这里插入图片描述

div>p

在这里插入图片描述

通过属性

在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值