Question

以下是列表项的HTML：

<li class="disabled-result" data-option-array-index="1" style="">4" (0)</li>

这是我要使用的JS，它不起作用：

var xpath = "li[contains(.,'4"')]";
var matchingElement = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
matchingElement.setAttribute('style', 'display: none;" ) !important' );

理想情况下，我只是为要隐藏的列表项分配一个ID，但这是一个Wordpress网站，因此很难做到。

我注意到的是，在页面源中，<li> html没有显示（仅在检查器中）。我在页脚中运行了JS。

任何帮助将不胜感激。我一直在为此挠头。

（我也尝试过不使用var matchingElement行的情况。我对使用Xpath不太熟悉，并且在过去大多数情况下都使用queryselector。）

编辑：这是<UL>

的完整代码

<ul class="chosen-results">
<li class="active-result result-selected" data-option-array-index="0" style="">Size</li>
<li class="disabled-result" data-option-array-index="1" style="">4" (0)</li>
<li class="disabled-result" data-option-array-index="2" style="">5" (0)</li>
<li class="active-result" data-option-array-index="3" style="">Extra Large (5)</li>
<li class="active-result" data-option-array-index="4" style="">Large (7)</li>
<li class="active-result" data-option-array-index="5" style="">Medium (8)</li>
<li class="disabled-result" data-option-array-index="6" style="">Small (0)</li>
</ul>

Answer 1

我不是100％肯定会解决其余的代码，但是您的xpath必须在其前面加上“ //”。如果您尝试在萤火虫或chrome元素dom中测试xpath，就会知道这一点。

var xpath = "//li[contains(.,'4"')]";

//像这样做。

var xpath = "//li[contains(.,'4\"')]";
var matchingElement = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
matchingElement.setAttribute('style', 'display: none;" ) !important' );

//我正在使用的代码会按预期删除元素。

<ul class="chosen-results">
<li class="active-result result-selected" data-option-array-index="0" style="">Size</li>
<li class="disabled-result" data-option-array-index="1" style="">4" (0)</li>
<li class="disabled-result" data-option-array-index="2" style="">5" (0)</li>
<li class="active-result" data-option-array-index="3" style="">Extra Large (5)</li>
<li class="active-result" data-option-array-index="4" style="">Large (7)</li>
<li class="active-result" data-option-array-index="5" style="">Medium (8)</li>
<li class="disabled-result" data-option-array-index="6" style="">Small (0)</li>
</ul>

<script type="text/javascript">
var xpath = "//li[contains(.,'4\"')]";
var matchingElement = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
matchingElement.setAttribute('style', 'display: none !important;')
</script>

Answer 2

请尝试以下代码：

var xpath = "//li[contains(text(), '4\"')]"; var matchingElement = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; matchingElement.setAttribute('style', 'display: none;" ) !important' );

您也可以尝试：

var xpath = "//li[@class = 'disabled-result' and contains(text(), '4\"')]"

使用XPath选择包含特定文本的LI时遇到问题

2 个答案: