previousSibling不工作

Question

我想通过选择第二个<p>并使用<p>属性来定位div中的第一个previousSibling，但它不起作用。

<div id="par">
<p id="p1">test</p>
<p id="p2">test</p>
</div>


document.getElementById('p2').previousSibling.className = 'red';

修改

确定它适用于除IE8之外的所有浏览器，但我希望它也能在IE8中工作，我尝试了以下条件，但没有效果：

var c = document.getElementById('p2').previousElementSibling.className = 'red';

if (c == undefined) {

    c = document.getElementById('p2').previousSibling.className = 'red';
}

除了IE8，它仍然适用于所有地方。如何更改IE8的上述条件？

编辑2：

管理它也可以在IE8中运行：

var c = document.getElementById('p2');

if (c.previousElementSibling) {

    c.previousElementSibling.className = 'red';

} else {

    c.previousSibling.className = 'red';

}

Answer 1

您需要使用previousElementSibling来获取上一个Element节点。

document.getElementById('p2').previousElementSibling.className = 'red';

http://jsfiddle.net/b6Bh8/

注意：根据上面的MDN链接，这不适用于IE＆lt; = 8。您可能需要遍历previousSibling，直到找到Element节点。

Answer 2

我相信这是最简单的方法：

var p=document.getElementById('p2');
do {
    p=p.previousSibling;
}while(p && p.tagName!='P');
p.className='red';