如何获取相邻元素的id

时间:2011-08-11 09:50:29

标签: javascript jquery dom

假设我有一个用于放置在两个元素之间的处理程序或者只是填充两个元素之间的空格。所以我的问题是如何获得与处理程序两侧相邻的元素id或类。

例如:

 #horizontal_handler { width:100%; height:5px; background:url('../pick.png')  }
 #vertical_handler { width:5px; height:100%; background:url('../pick.png')  }

这里我有两个处理程序,我只是放在两个div元素之间,在这里我怎么能得到这两个div元素的id。

<div id="top"></div>
<div id="horizontal_handler"></div>
<div id="bottom"> </div>

预期结果应为:顶部,底部

<div id="left"></div>
<div id="vertical_handler"></div>
<div id="right"> </div>

预期结果应为:左,右

2 个答案:

答案 0 :(得分:0)

$('#vartical_handler').prev().attr('id');
$('#vartical_handler').next().attr('id');

可重复使用功能:

function adjacentElementId(ref) {
    var arr = new Array;
    arr.push({
        'prevId': $(ref).prev().attr('id'),
        'nextId': $(ref).next().attr('id')
    });
    return arr;
}
var arrId = adjacentElementId('#vertical_handler').pop(); // Here you have just send the jquery reference. e.g. `'#vertical_handler'` here
console.log(arrId.prevId);
console.log(arrId.nextId);

答案 1 :(得分:0)

您可以参考jquery api页面中的.index()条目:http://api.jquery.com/index/

解决方案是:

var i = $('#vertical_handler').index();
$('div').get(i - 1).attr('id');
$('div').get(i + 1).attr('id');