不能將DOM節點的屬性用作XPath / CSS選擇器查詢的過濾器

Question

我正在嘗試使用DOM Node的屬性（例如innerText和textContent ）作為過濾器來搜索DOM元素，但沒有成功。

以以下HTML為例：

<html>
  <body>
    <div class="one">
      <div class="two">
        <div class="three">
          <div>Text Here</div>
        </div>
      </div>
    </div>
  </body>
</html>

如果我使用class屬性搜索節點，則可以使用XPath（評估）和CSS Selector（querySelectorAll）函數訪問innerText屬性：

document.evaluate("//div[@class = 'one']",
    document, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
    null).singleNodeValue.innerText;

document.querySelectorAll("div.one")[0].innerText;

但是，使用innerText屬性而不是class不會給我任何結果：

 document.evaluate("//div[@innerText = 'Text Here']",
     document, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
     null).singleNodeValue;

 document.querySelectorAll("div[innerText='Text Here']")[0];

我用nodeName和textContent進行了測試，它也失敗了，所以這就是為什么我認為它與不是標簽屬性的DOM屬性有關。

我嘗試使用XPath text()函數，但是在上例中的<div class="one">上使用它不會返回“ Text Here”。

所有測試均在Linux Mint的Google Chrome v67上進行。

為什么會這樣？ 我要做什么有解決方案或解決方法？

Answer 1

innerText不是屬性，因此@innerText不起作用。 另外， 'Text Here'不是<div class="one">的子文本節點，而是后代文本節點，因此//div[text()='Text Here' and @class='one']將不起作用（但是//div[.//text()='Text Here' and @class='one']應該可以）

您應該在下面嘗試按文本內容查找所需的div ：

document.evaluate("(//div[.='Text Here'])[1]",
     document, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
     null).singleNodeValue;

如果有更多的后代文本節點，但是您只想通過"Text Here"進行定位，則可以嘗試XPath：

(//div[.//div='Text Here'])[1]

不能將DOM節點的屬性用作XPath / CSS選擇器查詢的過濾器

問題描述

1 個解決方案

解決方案1
3 已采納 2018-06-25 04:48:23

不能將DOM節點的屬性用作XPath / CSS選擇器查詢的過濾器

問題描述

1 個解決方案

解決方案1 3 已采納 2018-06-25 04:48:23

解決方案1
3 已采納 2018-06-25 04:48:23