如何通过InnerText或类查找div结构中的DIV

How to find DIV inside div-structure by InnerText or Class(如何通过InnerText或类查找div结构中的DIV)

本文介绍了如何通过InnerText或类查找div结构中的DIV的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个包含多个子目录的div,其中有一个很大的div结构。现在,我要查找具有特定innerText的元素。 我怎么才能做到这一点呢? 我从文档中听说了一些事情。评估,但这是正确的事情吗?

<div className="main">
  <div className="child1">
    <div>
      <div><label className="text1">First Label</label></div>
    </div>
  </div>
  <div className="child2">
    <div>
      <div><label className="text2">Second Label</label></div>
    </div>
  </div>
  <div className="child3">
    <div>
      <div><label className="text3">Third Label</label></div>
    </div>
  </div>
</div>

我有Main,希望找到文本为Second Label Without Multiple Loop的标签。

推荐答案

在Java脚本中使用XPath表达式可以查询特定元素,并使用text()查询元素中的文本。

数据-lang="js"数据-隐藏="假"数据-控制台="真"数据-巴贝尔="假">
const getnodes = function(expr, parent) {
  let results = [];
  let contextNode = parent || document;
  let query = document.evaluate(expr, contextNode, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
  for (let i = 0, length = query.snapshotLength; i < length; ++i) {
    results.push(query.snapshotItem(i));
  }
  return results;
};


let col = getnodes('//div[@class="main"]//label/text()[ contains(.,"Second Label") ]');
col.forEach(n => {
  console.log(n.textContent)
});


let ref=document.querySelector('div.main > div.child3');

col=getnodes('div/div/label',ref);
col.forEach(n => {
  console.log('Using explicit reference node:',n.textContent)
});
<div class="main">
  <div class="child1">
    <div>
      <div><label class="text1">First Label</label></div>
    </div>
  </div>
  <div class="child2">
    <div>
      <div><label class="text2">Second Label</label></div>
    </div>
  </div>
  <div class="child3">
    <div>
      <div><label class="text3">Third Label</label></div>
    </div>
  </div>
</div>

这篇关于如何通过InnerText或类查找div结构中的DIV的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!

本文标题为:如何通过InnerText或类查找div结构中的DIV

基础教程推荐