Question

使用Chrome我试图定位列表的另一个元素

<ul>
<li><a href="#" id="One">One</a></li>
<li><a href="#" id="Two">Two</a></li>
<li><a href="#" id="Three">Three</a></li>
<li><a href="#" id="Four">Four</a></li>
<li><a href="#" id="Five">Five</a></li>
</ul>

这样可行，

document.getElementById("Three").parentNode.setAttribute("class", "active");

然而，这并没有让我感到困惑。

document.getElementById("Three").parentNode.previousSibling.setAttribute("class", "active");

以下是我在控制台中遇到的错误：

Uncaught TypeError: Object #<Text> has no method 'setAttribute'

Answer 1

作为父元素的<li>的前一个兄弟是一个文本节点（包含换行符），它没有setAttribute()方法。

如果从这些元素之间删除任何空格，那么JS的那一行将起作用：

<li><a href="#" id="Two">Two</a></li><li><a href="#" id="Three">Three</a></li>

演示：http://jsfiddle.net/HLGJE/

但是你可能不希望你的标记全部在一行上，所以你可以尝试这样的东西来跳过文本节点：

var prev = document.getElementById("Three").parentNode.previousSibling;
while(prev.nodeType == 3)
    prev = prev.previousSibling;
prev.setAttribute("class", "active");

演示：http://jsfiddle.net/HLGJE/2/

document.getElementById（“Three”）。parentNode.previousSibling.setAttribute给我带来问题

1 个答案: