XPath 和 CSS

Posted jcjc

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了XPath 和 CSS相关的知识,希望对你有一定的参考价值。

1、XPath

XPath 即 XML 路径语言 (XML Path Language),他是一种用来确定 xml 文档中某部分位置的语言。

  xml文档(html 属于 xml)是由一系列节点构成的树,例如:

  

<html>
    <body>
        <div>
            <p>Hello world</p>
            <a href = /home>Click here</a>        
        </div>
    </body>
</html>

xml 文档的节点有多种类型,其中最常用的有一下几种:

  (1)根节点   整个文档树的根

  (2)元素节点  html、body、div、p、a

  (3)属性节点   href

  (4)文本节点  Hello world、Click here

  节点间的关系有以下几种:

    (1)父子        body 是 html 的子节点,p 和 a 是div的子节点,反过来,div是p和a的父节点

    (2)兄弟  p 和 a 是兄弟节点

    (3)祖先、后裔  body、div、p、a 都是html的后裔节点,反过来 html 是body、div、p、a的祖先节点

2、基础语法

  XPath 常用的基本语法

表达式     描述    
/ 选中文档的根(root)  
. 选中当前节点
.. 选中当前节点的父节点
ELEMENT                     选中子节点中所有 ELEMENT 元素节点       
//ELEMENT 选中父点节点中所有 ELEMENT 元素节点  
* 选中所有元素子节点
text() 选中所有文本子节点
@ATTR 选中所有 ATTR 的属性节点
@* 选中所有属性节点
[谓语] 谓语是用来查找某个特定节点或者包含某个特定值的节点     

接下来,我们通过一些例子展示 XPath 的使用

  

>>> from scrapy.selector import Selector
>>> from scrapy.http import HtmlResponse
>>> body = ‘‘‘
...<html>
...    <head>
...       <base href=http://example.com/>
...       <title>Example website</title>
...    </head>    
...     <body>
...         <div id = images>
...               <a  href = image1.html>Name:  Image 1<br/>    
...               <a  href = image2.html>Name:  Image 2<br/>  
...               <a  href = image3.html>Name:  Image 3<br/>  
...               <a  href = image4.html>Name:  Image 4<br/>  
...               <a  href = image5.html>Name:  Image 5<br/>  
...          </div>
...     </body>
... </html>   
>>> response = HtmlResponse(url = ‘http://www.example.com‘)

3、常用函数

  XPath 还提供了许多函数,如数字、字符串、时间、日期、统计等。

  下面介绍两种十分常用的字符串函数

  (1)string(arg):返回传参数字符串值

  (2)contains(str1, str2):判断 str1 中是否包含 str2,返回布尔值

 

 

4、CSS

  CSS 即层叠样式表,其选择器是一种用来确定 HTML 文档中某部分位置的语言

  CSS 选择器的语法比 XPath 更简单一些,但功能不如 XPath 强大,实际上,当我们电泳 Selector 对象的 CSS 方法时,在其内部会使用 Python库 cssselect 将CSS 选择器表达式翻译成 XPath 表达式,然后电泳 Selector 对象的 XPath 方法。

 

以上是关于XPath 和 CSS的主要内容,如果未能解决你的问题,请参考以下文章

VSCode自定义代码片段——CSS选择器

VSCode自定义代码片段——CSS动画

VSCode自定义代码片段7——CSS动画

VSCode自定义代码片段7——CSS动画

VSCode自定义代码片段6——CSS选择器

使用 xpath 选择 css 类