87,907
社区成员
发帖
与我相关
我的任务
分享如何获得同级节点的className名称
我想点击“同级节点A”后获得 ul 引用的样式名称： block 要怎么实现？
用nextSibling能实现吗？我不想给ul 加id
用nextSibling能实现吗？我不想给ul 加id
function opnav(obj){
//想在这里输入ul引用的样式名称 block 我要怎么写这个js ?
}
<div>
<span onclick="opnav(this);">同级节点A</span>
<ul class="block">
<li>我的书包</li>
<li>我的钱包</li>
</ul>
</div>
...全文
请发表友善的回复…
发表回复
阿非 2010-04-18
- 打赏
- 举报
<div>
<span onclick="opnav(this);">同级节点A</span>
<ul class="block">
<li>我的书包</li>
<li>我的钱包</li>
</ul>
</div>
<script>
function opnav(obj){
var ul=obj.parentNode.getElementsByTagName('ul')[0];
if(ul)
{
alert(ul.className);
}
}
</script>
zoutuo 2010-04-18
- 打赏
- 举报
不加ID，不会
阿非 2010-04-18
- 打赏
- 举报
nextSibling 如下
<div>
<span onclick="opnav(this);">同级节点A</span>
<ul class="block">
<li>我的书包</li>
<li>我的钱包</li>
</ul>
</div>
<script>
function opnav(obj){
var el=obj.nextSibling;
while(el.nodeType!=1){
el=el.nextSibling;
if(!el) break;
};
alert(el.className);
}
</script>
llyy112233 2010-04-18
- 打赏
- 举报
nextSibling是可以的
但是如果HTML代码加入空格的话（如下），必须写为obj.nextSibling.nextSibling.className才行，因为xml dom会把空格也解析成一个节点
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script>
function opnav(obj){
alert(obj.nextSibling.className);
}
</script>
</HEAD>
<BODY>
<div><span onclick="opnav(this);">同级节点A</span><ul class="block"><li>我的书包</li><li>我的钱包</li></ul></div>
</BODY>
</HTML>
但是如果HTML代码加入空格的话（如下），必须写为obj.nextSibling.nextSibling.className才行，因为xml dom会把空格也解析成一个节点
<div>
<span onclick="opnav(this);">同级节点A</span>
<ul class="block">
<li>我的书包</li>
<li>我的钱包</li>
</ul>
</div>
