为了找到列表元素的同级 元素,javascript提供了一种称为node.nextSibling的方法。如果我们知道列表的任何成员,我们可以找到其同级。让我们简要地讨论一下。
node.nextSibling;
在以下示例中,有3个列表元素。使用 nextSibling属性,找到第一个元素的同级并将结果显示在输出中。
<html>
<body>
<ul><li id="item1">Tesla</li><li id="item2">Spacex</li><li id="item3">Solarcity</li></ul>
<p id="next"></p>
<script>
var x = document.getElementById("item1").nextSibling.innerHTML;
document.getElementById("next").innerHTML = "The sibling element is "+" "+x;
</script>
</body>
</html>输出结果
Tesla Spacex Solarcity The sibling element is Spacex
在以下示例中,有3个列表元素。使用 nextSibling属性,找到第二个元素的同级并将结果显示在输出中。兄弟元素不过是目标元素的下一个元素。
<html>
<body>
<ul><li id="item1">Tesla</li><li id="item2">Spacex</li><li id="item3">Solarcity</li></ul>
<p id="next"></p>
<script>
var x = document.getElementById("item2").nextSibling.innerHTML;
document.getElementById("next").innerHTML = "The sibling element is "+" "+x;
</script>
</body>
</html>输出结果
Tesla Spacex Solarcity The sibling element is Solarcity