标题:Xpath语法和介绍-Google Sheets使用方法基础

-------------------------------------------------------------------------------------------------------------------------------

时间:2018/12/3 21:45:39

-------------------------------------------------------------------------------------------------------------------------------

内容:

前面写了一篇文章 介绍使用google sheets里面的importxml 公式 使用xpath提取网页信息 这边附上一些基础知识 http://cotine.blog.hexun.com/117798350_d.html


Xpath简介(xpath,html,xml 3者之间关系)

XPath是XML Path的简称,它是一种非常强大的元素查找定位语法,使用这种xml 查找语言几乎可以定位到页面上的任意元素。又因为HTML文档本身就是一个标准的XML页面,所以我们可以使用XPath的语法来定位HTML语言写的网页上的页面元素。

XPath语法基本元素:

路径参考windows操作系统下文件的地址表示,例如c://tools/qq/pic/a.jpg,通过一系列的路径来定位位置(表示在c盘下的tools文件夹下的qq文件夹下的pic文件夹下的a文件,文件的后缀名为jpg)

xpath有2种类型的路径

绝对路径(/ )
查找页面根元素:/
查找页面上的form元素:/html/body/f0rm[1] 
表示的是在文档根目录的html标签下的body标签下的form标签,因为html和body都是唯一,但是body下的form有多个所以使用了form[1] 表示body下的第1个f0rm标签

注意:
1. 元素的xpath绝对路径可通过chrome直接查询。
2. 一般不推荐使用绝对路径的写法,因为一旦页面结构发生变化,该路径也随之失效,必须重新写。
3. 绝对路径以单/号表示,而下面要讲的相对路径则以//表示(2个斜线),这个区别非常重要。

相对路径(//)
查找页面内所有的input元素,无论在什么层级://input

绝对路径和相对路径的区别
当xpath的路径以/开头时,表示让Xpath解析引擎从文档的根节点开始解析
当xpath路径以//开头时,则表示让xpath引擎从文档的任意符合的元素节点开始进行解析。

/出现在xpath路径中时,则表示寻找父节点的直接子节点
//出现在xpath路径中时,表示寻找父节点下任意符合条件的子,孙,曾孙 节点,不管嵌套了多少层级。

弄清这个原则,就可以理解其实xpath的路径可以绝对路径和相对路径混合在一起来进行表示


索引查找([n])

如果有多个结果符合 这里使用标签名称[n] 这种形式代表 
 [3] 来符合的第3个结果
页面上的form元素:/html/body/f0rm[1] 表示的是在文档根目录的html标签下的body标签下的form标签,因为html和body都是唯一,但是body下的f0rm有多个所以使用了form[1] 表示body下的第1个form标签

//form[1]//input
查找页面上第一个form元素内的所有子input元素(只要在form元素内的input都算,不管还嵌套了多少个其他标签,使用相对路径表示,双//号):

//form[1]/input
查找页面上第一个form元素内的直接子input元素(即只包括form元素的下一级input元素,使用绝对路径表示,单/号):

//form[1]/input[3]

(如果有多个input返回值符合 可以使用//f0rm[1]/input[3]) 表示符合条件的第3个input

属性查找([@])

查找页面上id为loginform的form元素:
//form[@id='loginf0rm']

查找页面上具有name属性为username的input元素:
//input[@name='username']

查找页面上id为loginform的form元素下的第一个input元素:
//form[@id='loginf0rm']/input[1]

查找页面上任意标签但是包含id属性以及值为loginf0rm下的第一个input元素:
//*[@id='loginf0rm']/input[1]

下面讲3种高级的方法

1 xpath多属性组合查找-符合多个属性值的元素 ([][])

使用多个连续的[] 将属性条件合并在一起 并列查找页面具有name属性为contiune并且type属性为button的input元素:

//input[@name='continue'][@type='button']

上面是并列满足 如果是多属性只要满足一个的是
//input[@name='continue' or @type='button']
//a[@name or @href]


2 xpath 属性查找后-返回另外一个属性的值//*[@属性1=值1]

/@属性2通过[@属性1=值1]/@属性2

例如页面有一段代码是
<meta itemprop="price" content="888.0">
现在我们需要取出来这个888这个值
我们使用 
//*[@itemprop="price"]/@content 获取这个zhi
这里解释下//*[@itemprop="price"] 表示匹配任何标签 只要包含属性itemprop 并且值为price, 这样就得到了这个<meta整个标签,然后通过/@content 来获取这个标签中content的值 ,类似的还是有a/@href 获取a标签的href值


3 xpath 属性加索引合并查找-属性选择后有多个返回结果 

使用属性查找以后 会有多个符合的结果 
需要再筛选一次索引值后再使用 

举例如下查找页面具有name属性为contiune的input元素 

但是有10个input, 需要找到第8个input
 然后再找第8个input元素下包含的a标签的href属性
(//input[@name='continue'])[8]//a/@href

这里要注意下  
先选择属性后 //input[@name='continue'] 需要括号() 再使用[8] 才能选择第8个复合条件的元素
再使用//a 代表这第8个input下面的 所有子元素中的a标签 然后在使用/@href 取出这个元素的 href值

如果不打括号会逻辑混乱 这点要注意 既选择了属性后的多个结果需要用括号再指定下取的具体序列

最后附上老外的一个cheat sheet
https://devhints.io/xpath
有很多学习的例子

前面写了一篇文章 介绍使用google sheets里面的importxml 公式 使用xpath提取网页信息 这边附上一些基础知识 http://cotine.blog.hexun.com/117798350_d.html

Xpath简介(xpath,html,xml 3者之间关系)

XPath是XML Path的简称,它是一种非常强大的元素查找定位语法,使用这种xml 查找语言几乎可以定位到页面上的任意元素。又因为HTML文档本身就是一个标准的XML页面,所以我们可以使用XPath的语法来定位HTML语言写的网页上的页面元素。

XPath语法基本元素:

路径参考windows操作系统下文件的地址表示,例如c://tools/qq/pic/a.jpg,通过一系列的路径来定位位置(表示在c盘下的tools文件夹下的qq文件夹下的pic文件夹下的a文件,文件的后缀名为jpg)

xpath有2种类型的路径

绝对路径(/ )
查找页面根元素:/
查找页面上的form元素:/html/body/f0rm[1] 
表示的是在文档根目录的html标签下的body标签下的form标签,因为html和body都是唯一,但是body下的form有多个所以使用了form[1] 表示body下的第1个f0rm标签

注意:
1. 元素的xpath绝对路径可通过chrome直接查询。
2. 一般不推荐使用绝对路径的写法,因为一旦页面结构发生变化,该路径也随之失效,必须重新写。
3. 绝对路径以单/号表示,而下面要讲的相对路径则以//表示(2个斜线),这个区别非常重要。

相对路径(//)
查找页面内所有的input元素,无论在什么层级://input

绝对路径和相对路径的区别
当xpath的路径以/开头时,表示让Xpath解析引擎从文档的根节点开始解析
当xpath路径以//开头时,则表示让xpath引擎从文档的任意符合的元素节点开始进行解析。

/出现在xpath路径中时,则表示寻找父节点的直接子节点
//出现在xpath路径中时,表示寻找父节点下任意符合条件的子,孙,曾孙 节点,不管嵌套了多少层级。

弄清这个原则,就可以理解其实xpath的路径可以绝对路径和相对路径混合在一起来进行表示


索引查找([n])

如果有多个结果符合 这里使用标签名称[n] 这种形式代表 
 [3] 来符合的第3个结果
页面上的form元素:/html/body/f0rm[1] 表示的是在文档根目录的html标签下的body标签下的form标签,因为html和body都是唯一,但是body下的f0rm有多个所以使用了form[1] 表示body下的第1个form标签

//form[1]//input
查找页面上第一个form元素内的所有子input元素(只要在form元素内的input都算,不管还嵌套了多少个其他标签,使用相对路径表示,双//号):

//form[1]/input
查找页面上第一个form元素内的直接子input元素(即只包括form元素的下一级input元素,使用绝对路径表示,单/号):

//form[1]/input[3]

(如果有多个input返回值符合 可以使用//f0rm[1]/input[3]) 表示符合条件的第3个input

属性查找([@])

查找页面上id为loginform的form元素:
//form[@id='loginf0rm']

查找页面上具有name属性为username的input元素:
//input[@name='username']

查找页面上id为loginform的form元素下的第一个input元素:
//form[@id='loginf0rm']/input[1]

查找页面上任意标签但是包含id属性以及值为loginf0rm下的第一个input元素:
//*[@id='loginf0rm']/input[1]

下面讲3种高级的方法

1 xpath多属性组合查找-符合多个属性值的元素 ([][])

使用多个连续的[] 将属性条件合并在一起 并列查找页面具有name属性为contiune并且type属性为button的input元素:

//input[@name='continue'][@type='button']

上面是并列满足 如果是多属性只要满足一个的是
//input[@name='continue' or @type='button']
//a[@name or @href]


2 xpath 属性查找后-返回另外一个属性的值//*[@属性1=值1]

/@属性2通过[@属性1=值1]/@属性2

例如页面有一段代码是
<meta itemprop="price" content="888.0">
现在我们需要取出来这个888这个值
我们使用 
//*[@itemprop="price"]/@content 获取这个zhi
这里解释下//*[@itemprop="price"] 表示匹配任何标签 只要包含属性itemprop 并且值为price, 这样就得到了这个<meta整个标签,然后通过/@content 来获取这个标签中content的值 ,类似的还是有a/@href 获取a标签的href值


3 xpath 属性加索引合并查找-属性选择后有多个返回结果 

使用属性查找以后 会有多个符合的结果 
需要再筛选一次索引值后再使用 

举例如下查找页面具有name属性为contiune的input元素 

但是有10个input, 需要找到第8个input
 然后再找第8个input元素下包含的a标签的href属性
(//input[@name='continue'])[8]//a/@href

这里要注意下  
先选择属性后 //input[@name='continue'] 需要括号() 再使用[8] 才能选择第8个复合条件的元素
再使用//a 代表这第8个input下面的 所有子元素中的a标签 然后在使用/@href 取出这个元素的 href值

如果不打括号会逻辑混乱 这点要注意 既选择了属性后的多个结果需要用括号再指定下取的具体序列

最后附上老外的一个cheat sheet
https://devhints.io/xpath
有很多学习的例子