谷歌浏览器,对于作为程序员的我们来说可以是居家必备了,应该用的相当的熟悉了,我们用的最多的应该是network选项吧,一般用来分析网页加载的请求信息,比如post参数之类的,这些基本的功能基本上够用了,今天我说的不是network模块,而是console命令模块的使用,

关于console命令的使用网上也有很多的介绍了,但是大多数的都是互相抄袭,根本不知道谁才是作者,在此和大家分享一下 谷歌控制台的命令的妙用。
通过网上的信息我得知

目前控制台方法和属性有:["$$", "$x", "dir", "dirxml", "keys", "values", "profile", "profileEnd", "monitorEvents", "unmonitorEvents", "inspect", "copy", "clear", "getEventListeners", "undebug", "monitor", "unmonitor", "table", "$0", "$1", "$2", "$3", "$4", "$_"]
今天说的是$x命令。

$x的用法是 :$x(xpath表达式) 下面的例子是获取,写文章时的添加随笔这四个词的一个xpath.

$x("//div[@id='Editor_Edit']/div/span/text()")

简单的说下这个xpath,//表示的是不管前面多少级都匹配(包含一级),/是只匹配一级 ,@符号表示的是取元素的属性后面紧跟的=内容就是这个值"Editor_Edit",看上图我们发现div下面紧挨着的还是div,然后div再下一级就是span了,到此时下xpath可以写成这样了、//div[@id='Editor_Edit']/div/span

但是我们获取的是span的这个节点,文本信息一般在节点里面,获取节点的文本我们用text(),到目前来说我们已经写完了,但是这里要注意的一点是,不同的语言和工具在选择xpath的一些信息的时候,多多少少有点不同,这里我们看一下,我们执行完xpath之后的结果

我们发现我们获取了一个text的节点而不是文本信息,这时候呢,如果在python中使用lxml的已经可以成功获取文本值了,但是控制台的还要再操作一步

就是我们需要获取它的nodeValue属性才可以。我们再进一步写就是这一样

$x("//div[@id='Editor_Edit']/div/span/text()")[0]

在这里说个小技巧,我们在写完上面的内容之后 会发现我们点方法的时候点不出东西,这个时候我们可以这样写

var temp=$x("//div[@id='Editor_Edit']/div/span/text()")[0]
获取之后我们再看结果,咦underfined,逗我呢,?

emmm。。 ,,相信大家在初学python的时候也遇到过相似的问题,方法的默认返回值None,嗯 这个时候我们就知道了

这个情况类型,不用在乎这个返回值了,我们需要的不是这个值,经过上面的操作,我们做了一件什么事儿呢,

把获取的节点结果赋值给temp这个变量,此时temp可以作为全局变量存在,好了这时候 我们temp.一下发现 好多属性提示都出来了

ok,这个$x的功能就是这么简单,同时我们在调试过程中也方便了许多。喜欢的小伙儿们随手转发一下吧,后续和大家分析其他的关于谷歌浏览器控制台的操作内容。

当前节点的xpath操作
上面都是对元素进行一次xpath操作,有时候我们需要在当前节点下面操作节点,这时候怎么做呢,
我在网上找到了$x的源码:

$x = function (xpath, context) {var nodes = [];try {var doc = (context && context.ownerDocument) || window.document;var results = doc.evaluate(xpath, context || doc, null, XPathResult.ANY_TYPE, null);var node;while (node = results.iterateNext()) {nodes.push(node);}} catch (e) {throw e;}return nodes;}

惊讶的发现,$x实际上是两个参数的,第一个参数xpath表达式,第二个参数context,如果没有指定context参数,$x()将在当前的 HTML document中查找 DOM 元素;如果指定了 context 参数,如一个 DOM元素集或jQuery对象,那就会在这个 context 中查找。
Context参数需要是一个正常工作的节点对象(DOM对象,而不jQuery对象)。虽然传递jQuery对象也可以起到限定查找范围的作用,但是这样的话,那么jQuery对象的context属性就会变成整个Document对象。
百度首页为例。

$x(".//input[@type='submit']",$x("//form[@id='form']"))

更多内容参考公众号:python学习开发。

xpath 第一个元素_Chrome控制台的妙用之使用XPATH相关推荐

  1. xpath 第一个元素_贝程学院:Selenium与XPath

    一.为什么学习XPath XPath (XML Path Language)最初是用来在 XML 文档中定位 DOM 节点的语言.由于 HTML 也可以算作 XML 的一种实现,所以 Selenium ...

  2. xpath 第一个元素_XPath

    XPath即为XML路径语言(XML Path Language),它是一种用来确定XML文档中某部分位置的语言,但它同样适用于HTML的文档搜索. 在爬虫中我们使用xpath提取特定位置的文本内容 ...

  3. class 第一个元素_第二章(第3节):网页元素定位和操作

    大家仔细思考一下,我们用 selenium 操控浏览器是什么意思,其实就是用 selenium 模拟人上网,也就是说人用浏览器能做的任何事情,我们用 selenium 都可以做,selenium 就如 ...

  4. Java黑皮书课后题第8章:***8.35(最大块)给定一个元素为0或者1的方阵,编写程序,找到一个元素都为1的最大的子方阵。程序提示用户输入矩阵的行数。然后显示最大的子方阵的第一个元素、行数

    ***8.35(最大块)给定一个元素为0或者1的方阵,编写程序,找到一个元素都为1的最大的子方阵.程序提示用户输入矩阵的行数.然后显示最大的子方阵的第一个元素.行数 题目 题目描述与运行示例 破题 代 ...

  5. class 第一个元素_selenium之元素定位方式

    # Xpath定位方式,非常常用,很试用于项目结构长期不会变化的项目 可以使用以下Xpath来定位元素# 1.绝对路径定位# 2.使用元素属性定位# 3.层级与属性结合# 4.使用逻辑运算符# 5.使 ...

  6. web自动化测试(一) 介绍 及 Xpath,Css 定位元素

    1.1什么是自动化测试 自动化测试的概念: 软件自动化测试就是通过测试工具或者其他手段, 按照测试人员的预定计划对软件产品进行自动化 测试,他是软件测试的一个重要组成部分,能够 完成许多手工测试无法完 ...

  7. 从键盘输入10个互不相同的整数,找出其中最小的元素将其与数组中的第一个元素进行交换。

    题目: /* 从键盘输入10个互不相同的整数,找出其中最小的元素将其与数组中的第一个元素进行交换. */ 代码: c++做的. #include<iostream> using names ...

  8. jq取第一个子元素为select_jquery如何获取第一个或最后一个子元素?

    jquery如何获取第一个或最后一个子元素? 通过children方法,children("input:first-child") $(this).children("i ...

  9. Python代码发现链表中的环并输出环中的第一个元素

    Python代码发现链表中的环并输出环中的第一个元素 # Python代码发现链表中的环并输出环中的第一个元素 # Find first node of loop in a linked list # ...

最新文章

  1. 轻量级NLP工具开源,中文处理更精准,超越斯坦福Stanza
  2. 《虚拟化工程师》-真实环境-培训计划 v0.0.1( 赠送:第 01\02 章 (免费视频))...
  3. 【NLP】TransformerXL:因为XL,所以更牛
  4. 使用视觉信息,为什么能把移动机器人的空间位置信息记录下来
  5. ubuntu dpkg
  6. 五、概念数据模型(CDM生成LDM,PDM和OOM)
  7. mysql大数据高并发处理
  8. asp.net 页面引入外部JS 在IE6下延迟加载报错,IE7+均没问题
  9. elasticsearch核心原理
  10. 【更新】PDF控件Spire.PDF V3.9.463发布 | 修复多个PDF转换bug
  11. jdk 文档下载地址
  12. python win32api sendmessage_win32api win32gui win32con 窗口句柄 发送消息 常用方法
  13. python前端Django指南之Hello worldl输出
  14. 数学建模——数据包络分析步骤及程序详解
  15. 微信支付开发:当前URL未注册
  16. morning 是字符串的内容变成good_小洁详解《R数据科学》--第十章 使用stringr处理字符串(上)...
  17. 2022届软件技术专业毕业生就业岗位分析(.Net方向)
  18. Shader初级(纹理坐标篇)
  19. 美国国家安全局发布零信任安全模型指南
  20. 用VHDL编写testbench激励文件

热门文章

  1. 我对象说陪我过七夕,象说没时间,我一怒给女神做了一个某音上很火的3D旋转相册
  2. XSSFWorkbook 设置单元格样式_openpyxl3.0官方文档(25)—— 使用样式
  3. mysql怎么导出导入数据库结构_mysql导入SQL、导出数据库、表、结构
  4. python中config方法作用,python中ConfigParse模块的用法
  5. MFC的Dialogbox多行文本框(CEdit)有最大字符限制,默认最大显示长度
  6. 在ASP.NET MVC中使用Knockout实践07,自定义验证信息的位置与内容
  7. 详解Parcel:快速,零配置web应用打包工具
  8. Solr 中 Schema 结构说明
  9. Sublime的Package Control安装方法
  10. 【Todo】Java类型转换总结