如何获得同级节点的className名称

本帖最后由 aier520 于 2010-04-18 00:21:32 编辑

解决方案 »

  1.   


    <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>
      

  2.   

    nextSibling是可以的
    <!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>
      

  3.   

    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>