2019年11月1日
| 标签:
前面写了一篇文章 介绍使用google sheets里面的importxml 公式 使用xpath提取网页信息 这边附上一些基础知
Xpath简介（xpath，html，xml 3者之间关系）
XPath是XML Path的简称，它是一种非常强大的元素查找定位语法，使用这种xml 查找语言几乎可以定位到页面上的任意元素。又因为HTML文档本身就是一个标准的XML页面，所以我们可以使用XPath的语法来定位HTML语言写的网页上的页面元素。
XPath语法基本元素：
路径参考ｗｉｎｄｏｗs操作系统下文件的地址表示，例如c://tools/qq/pic/a.jpg，通过一系列的路径来定位位置（表示在c盘下的tools文件夹下的qq文件夹下的pic文件夹下的a文件，文件的后缀名为jpg）
xpath有2种类型的路径
绝对路径（/ ）
查找页面根元素：/
查找页面上的ｆｏｒｍ元素：/html/body/f0rm[1]
表示的是在文档根目录的html标签下的body标签下的ｆｏｒｍ标签，因为html和body都是唯一，但是body下的ｆｏｒｍ有多个所以使用了ｆｏｒｍ[1] 表示body下的第1个f0rm标签
注意：
1. 元素的xpath绝对路径可通过chrome直接查询。
2. 一般不推荐使用绝对路径的写法，因为一旦页面结构发生变化，该路径也随之失效，必须重新写。
3. 绝对路径以单/号表示，而下面要讲的相对路径则以//表示（2个斜线），这个区别非常重要。
相对路径（//）
查找页面内所有的input元素，无论在什么层级：//input
绝对路径和相对路径的区别
当xpath的路径以/开头时，表示让Xpath解析引擎从文档的根节点开始解析
当xpath路径以//开头时，则表示让xpath引擎从文档的任意符合的元素节点开始进行解析。
当/出现在xpath路径中时，则表示寻找父节点的直接子节点，
当//出现在xpath路径中时，表示寻找父节点下任意符合条件的子，孙，曾孙 节点，不管嵌套了多少层级。
弄清这个原则，就可以理解其实xpath的路径可以绝对路径和相对路径混合在一起来进行表示
索引查找（[n]）
如果有多个结果符合 这里使用标签名称[n] 这种形式代表
[3] 来符合的第3个结果
页面上的ｆｏｒｍ元素：/html/body/f0rm[1] 表示的是在文档根目录的html标签下的body标签下的ｆｏｒｍ标签，因为html和body都是唯一，但是body下的f0rm有多个所以使用了ｆｏｒｍ[1] 表示body下的第1个ｆｏｒｍ标签
//ｆｏｒｍ[1]//input
查找页面上第一个form元素内的所有子input元素（只要在ｆｏｒｍ元素内的input都算，不管还嵌套了多少个其他标签，使用相对路径表示，双//号）：
//ｆｏｒｍ[1]/input
查找页面上第一个form元素内的直接子input元素（即只包括ｆｏｒｍ元素的下一级input元素，使用绝对路径表示，单/号）：
//ｆｏｒｍ[1]/input[3]
（如果有多个input返回值符合 可以使用//f0rm[1]/input[3]） 表示符合条件的第3个input
属性查找（[@]）
查找页面上id为loginｆｏｒｍ的ｆｏｒｍ元素：
//ｆｏｒｍ[@id=’loginf0rm’]
查找页面上具有name属性为username的input元素：
//input[@name=’username’]
查找页面上id为loginｆｏｒｍ的ｆｏｒｍ元素下的第一个input元素：
//ｆｏｒｍ[@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语法基本元素：
路径参考ｗｉｎｄｏｗs操作系统下文件的地址表示，例如c://tools/qq/pic/a.jpg，通过一系列的路径来定位位置（表示在c盘下的tools文件夹下的qq文件夹下的pic文件夹下的a文件，文件的后缀名为jpg）
xpath有2种类型的路径
绝对路径（/ ）
查找页面根元素：/
查找页面上的ｆｏｒｍ元素：/html/body/f0rm[1]
表示的是在文档根目录的html标签下的body标签下的ｆｏｒｍ标签，因为html和body都是唯一，但是body下的ｆｏｒｍ有多个所以使用了ｆｏｒｍ[1] 表示body下的第1个f0rm标签
注意：
1. 元素的xpath绝对路径可通过chrome直接查询。
2. 一般不推荐使用绝对路径的写法，因为一旦页面结构发生变化，该路径也随之失效，必须重新写。
3. 绝对路径以单/号表示，而下面要讲的相对路径则以//表示（2个斜线），这个区别非常重要。
相对路径（//）
查找页面内所有的input元素，无论在什么层级：//input
绝对路径和相对路径的区别
当xpath的路径以/开头时，表示让Xpath解析引擎从文档的根节点开始解析
当xpath路径以//开头时，则表示让xpath引擎从文档的任意符合的元素节点开始进行解析。
当/出现在xpath路径中时，则表示寻找父节点的直接子节点，
当//出现在xpath路径中时，表示寻找父节点下任意符合条件的子，孙，曾孙 节点，不管嵌套了多少层级。
弄清这个原则，就可以理解其实xpath的路径可以绝对路径和相对路径混合在一起来进行表示
索引查找（[n]）
如果有多个结果符合 这里使用标签名称[n] 这种形式代表
[3] 来符合的第3个结果
页面上的ｆｏｒｍ元素：/html/body/f0rm[1] 表示的是在文档根目录的html标签下的body标签下的ｆｏｒｍ标签，因为html和body都是唯一，但是body下的f0rm有多个所以使用了ｆｏｒｍ[1] 表示body下的第1个ｆｏｒｍ标签
//ｆｏｒｍ[1]//input
查找页面上第一个form元素内的所有子input元素（只要在ｆｏｒｍ元素内的input都算，不管还嵌套了多少个其他标签，使用相对路径表示，双//号）：
//ｆｏｒｍ[1]/input
查找页面上第一个form元素内的直接子input元素（即只包括ｆｏｒｍ元素的下一级input元素，使用绝对路径表示，单/号）：
//ｆｏｒｍ[1]/input[3]
（如果有多个input返回值符合 可以使用//f0rm[1]/input[3]） 表示符合条件的第3个input
属性查找（[@]）
查找页面上id为loginｆｏｒｍ的ｆｏｒｍ元素：
//ｆｏｒｍ[@id=’loginf0rm’]
查找页面上具有name属性为username的input元素：
//input[@name=’username’]
查找页面上id为loginｆｏｒｍ的ｆｏｒｍ元素下的第一个input元素：
//ｆｏｒｍ[@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
有很多学习的例子
没有评论
