使用JavaScript获取下一个/上一个元素？

,哪个是前一个.

1> Crescent Fre..：

---

使用nextSibling和previousSibling属性:

document.getElementById('foo2').nextSibling; // #foo3
document.getElementById('foo2').previousSibling; // #foo1

但是在某些浏览器中(我忘了哪些)你还需要检查空格和注释节点:

var div = document.getElementById('foo2');
var nextSibling = div.nextSibling;
while(nextSibling && nextSibling.nodeType != 1) {
    nextSibling = nextSibling.nextSibling
}

像jQuery这样的库可以为您提供开箱即用的所有这些跨浏览器检查.

---

nextElementSibling更有用.

---

请注意,nextSibling和nextElementSibling都不是完全跨浏览器兼容的.Firefox的nextSibling返回文本节点,而IE则没有,而nextElementsibling直到IE9才会实现.

---

如果元素不是兄弟姐妹,这将不起作用.

2> REA_ANDREW..：

---

在纯JavaScript中,我的想法是你首先必须在集合中整理它们.

var divs = document.getElementsByTagName("div");
//divs now contain each and every div element on the page
var selectionDiv = document.getElementById("MySecondDiv");

所以基本上用selectionDiv遍历集合来找到它的索引,然后显然-1 =前一个+1 =下一个边界内

for(var i = 0; i < divs.length;i++)
{
   if(divs[i] == selectionDiv)
   {
     var previous = divs[i - 1];
     var next = divs[i + 1];
   }
}

请注意,虽然我说需要额外的逻辑来检查你是否在范围内,即你不在收集的最后或开始.

这也意味着你说有一个div嵌套了一个div.下一个div不是兄弟姐妹而是孩子,所以如果你只想让兄弟姐妹与目标div处于同一级别,那么肯定使用nextSibling检查tagName属性.

3> Andy Hume..：

---

真的取决于您的文档的整体结构.

如果你有:

它可能就像穿越使用一样简单

mydiv.nextSibling;
mydiv.previousSibling;

但是,如果"下一个"div可以在文档中的任何位置,则需要更复杂的解决方案.你可以试试用

document.getElementsByTagName("div");

并通过这些来到达你想要的地方.

如果您正在进行大量复杂的DOM遍历,我会建议您查看jQuery等库.

---

我认为nextSibling()..应该是nextSibling

4> 小智..：

---

每个HTMLElement都有一个属性,"previousElementSibling".

例如:

A
B
c

Resultado: 

---

var b = document.getElementById("c").previousElementSibling;

document.getElementById("result").innerHTML += b.innerHTML;

直播:http://jsfiddle.net/QukKM/

5> 小智..：

---

这将很容易......它是一个纯粹的JavaScript代码