JavaScript 技术篇-js通过xpath获取dom节点,js校验xpath唯一性

简介: JavaScript 技术篇-js通过xpath获取dom节点,js校验xpath唯一性

       

document.evaluate() 就是通过 xpath 获取 dom 节点。

返回的结果通过 .iterateNext() 可以获得 dom 对象,每次调用会少一个,当没有时就返回空。

返回匹配到的第一个 xpath 对应的 dom 节点

function x(xpath) {
  var result = document.evaluate(xpath, document, null, XPathResult.ANY_TYPE, null);
  return result.iterateNext()
}

返回匹配到 xpath 的 dom 节点个数

function x(xpath) {
  var result = document.evaluate(xpath, document, null, XPathResult.ANY_TYPE, null);
  var i = 0;
  while(result.iterateNext()){
    i++;
  }
  return i;
}

如果想通过 xpath 获取 iframe 框架内的 dom 节点,评论区留言哦!

喜欢的点个赞❤吧!

目录
相关文章
|
4天前
|
XML JavaScript 数据格式
XML DOM 遍历节点树
在处理XML文档时,我们常需提取各元素值,这时就要用到XML DOM的节点树遍历功能。以下示例展示了如何遍历根元素的所有子节点,并输出它们的名称和值:例如 "title: Everyday Italian","author: Giada De Laurentiis" 和 "year: 2005"。实现步骤包括:加载XML字符串到xmlDoc对象,获取根元素子节点,最后输出每个子节点的名称与文本节点的值。
|
4天前
|
存储 JavaScript
DOM 节点列表长度(Node List Length)
名为 "title" 的元素节点,并存储在节点列表 x 中。通过 "length" 属性确定 x 的长度(即 "title" 节点总数)。利用 for 循环遍历整个列表,访问每个 "title" 节点的第一个子节点的值,并将其写入文档。
|
2天前
|
JavaScript
DOM 节点列表长度(Node List Length)
DOM 节点列表长度(Node List Length)
|
2天前
|
XML JavaScript 数据格式
XML DOM 遍历节点树
XML DOM 遍历节点树
|
4天前
|
运维 Cloud Native JavaScript
云端新纪元:云原生技术深度解析深入理解Node.js事件循环及其在异步编程中的应用
【8月更文挑战第27天】随着云计算技术的飞速发展,云原生已成为推动现代软件开发和运维的关键力量。本文将深入探讨云原生的基本概念、核心价值及其在实际业务中的应用,帮助读者理解云原生如何重塑IT架构,提升企业的创新能力和市场竞争力。通过具体案例分析,我们将揭示云原生技术背后的哲学思想,以及它如何影响企业决策和操作模式。
|
1天前
|
JavaScript 开发者 UED
Vue.js 错误处理与调试:跟上技术潮流,摆脱开发困扰,成为代码大神不是梦!
【8月更文挑战第30天】在 Vue.js 开发中,错误处理与调试至关重要。本文将对比 Vue 的全局错误捕获机制 `Vue.config.errorHandler` 和组件内 `watch` 监听数据变化的方式,并介绍 Vue 开发者工具、控制台打印 (`console.log`) 以及代码断点 (`debugger`) 等调试方法。此外,还将探讨如何通过自定义错误页面提升用户体验。通过这些技巧的对比,帮助开发者灵活选择适合的策略,确保应用稳定性和开发效率。
|
1天前
|
JavaScript 前端开发 开发者
Vue.js 响应式变革来袭!结合热点技术,探索从 Object.defineProperty 到 Proxy 的奇妙之旅,触动你的心
【8月更文挑战第30天】在 Vue.js 中,响应式系统自动追踪并更新数据变化,极大提升了开发体验。早期通过 `Object.defineProperty` 实现,但存在对新旧属性处理及数组操作的局限。Vue 3.0 引入了 `Proxy`,克服了上述限制,提供了更强大的功能和更好的性能。实践中,可根据项目需求选择合适的技术方案,并优化数据操作,利用懒加载等方式提升性能。
|
11月前
|
前端开发 JavaScript
探索JavaScript元素节点的属性和方法
探索JavaScript元素节点的属性和方法
27 0
|
4月前
|
前端开发 JavaScript
探索JavaScript元素节点的属性和方法
探索JavaScript元素节点的属性和方法
24 0
|
JavaScript 前端开发
前端祖传三件套JavaScript的DOM之节点层次、类型、属性
随着互联网的不断发展,前端技术也在不断地更新迭代。但是,无论怎么更新变化,JavaScript、DOM、CSS 三件套的重要性始终不可替代。其中,JavaScript 的作用尤为关键。本文将聚焦于 JavaScript 中的 DOM,讨论节点层次、类型和属性等概念。
131 0