Error message here!

Hide Error message here!

忘记密码?

Error message here!

请输入正确邮箱

Hide Error message here!

密码丢失?请输入您的电子邮件地址。您将收到一个重设密码链接。

Error message here!

返回登录

Close

爬虫基础一 Chrome 开发者工具 与 XPath选择Html

Sunrisepeak 2019-01-24 12:27:00 阅读数:253 评论数:0 点赞数:0 收藏数:0

一、Chrome 开发者工具的使用

chrome开发者工具

简单介绍

Element:把Html文档以DOM(Document Object Model)树的形式呈现出来

 

Console:用来输入命令的控制台,例如用XPath的命令查找相关html的元素

Sources: 网页的目录结构(代码<css, html....>、资源文件等),可用于了解网页的代码设计的层次,及其使用css代码等。

 

Other:https://www.cnblogs.com/Fang3s/p/3965231.html

 

二、XPath选择Html元素


 

1.路径表达式:

  在开发者工具中Console界面使用$x工具函数:

 

使用Chrome获取Xpath表达式

 

2.常见函数、及其表达式:

条件表达式:元素[条件表达式]

id为home的div标签
div[@id = "home"]

text():获取文本信息的函数

获取id为firstHeading的h1标签下span中的text
//h1[@id="firstHeading"]/span/text()

多个相同元素的数组选择:img[]

选择class属性值为infobox的表格中的第一张图片的url
//table[@class="infobox"]//img[1]/@src

逻辑运算and 和 contains()函数

contains可用来对属性的选择(匹配)contains(@属性关键字,"属性值")
and就是与
获取class属性包含ltr和skin-vector的任意元素内所h1中的文本
//*[contains(@class,"ltr") and contains(@class, "skin-vector")]//h1//text()

 开头固定的字符串匹配:starts-with(relative, base)

选择class属性以reflist开头的div标签中所有的url
//div[starts-with(@class, "reflist")]//a/@href

获取页面中每张图片的URL

//img/@src

详细XPath内容可参见W3cschool:http://www.w3school.com.cn/xpath/index.asp

 

 3.XPath表达式使用的注意事项

  • 避免使用数组索引(数值)
    //*[@id="myid"]/div/div/div[1]/div[2]/div[1]/div[1]/a/img
    例如广告区域一旦在其增加一个div或减少一个div就可能照成上述表达式的数据索引不能匹配到
    理想的信息,应该尽可能的使用id号或者class等属性进行查找元素,提高代码的鲁棒性
    //div[@class="thumbnail"]/a/img 

     

  • 类并没有那么好用:布局类通常是通过css来改变页面的外观,一旦布局发生变化,可能class属性值就会发生变化
    //div[@class="thumbnail"]/a/img
    当页面布局发生变化时,信息就变为
    //div[@class = "priview green"]/a/img

     

  • 有意义的面向数据的类比具体面向布局的类更好:有意义的数据类的有效期相对较长且不会轻易改变
  • ID可靠性最佳

 

文章引用:

 

版权声明
本文为[Sunrisepeak]所创,转载请带上原文链接,感谢
https://www.cnblogs.com/sunrisepeak/p/10311955.html

编程之旅,人生之路,不止于编程,还有诗和远方。
阅代码原理,看框架知识,学企业实践;
赏诗词,读日记,踏人生之路,观世界之行;

支付宝红包,每日可领