Question

我有一个带孩子的div，我需要抓取寻找特定的链接。 HTML看起来像这样：

<div id="ctl00_LeftNav">
    <h3>
        <a href="../App_Templates/#" rel="0">Menu 1</a></h3>
    <div>
        <p>
            <span>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(1);">Opt 1</a></div>
                <div style="padding-left: 10px;">
                    <a href="javascript:OnLeftMenuSelection(56);">Opt 1a</a></div>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(2);">Opt 2</a></div>
            </span>
        </p>
    </div>
    <h3>
        <a href="../App_Templates/#" rel="1">Menu 2</a></h3>
    <div>
        <p>
            <span>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(33);">Opt 1</a></div>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(34);">Opt 2</a></div>
                <div style="padding-left: 10px;">
                    <a href="javascript:OnLeftMenuSelection(42);">Opt 2a</a></div>
            </span>
        </p>
    </div>
    <h3>
        <a href="../App_Templates/#" rel="2">Menu 3</a></h3>
    <div>
        <p>
            <span>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(58);">Opt 1</a></div>
                <div style="padding-left: 0px; font-weight: bold;">
                    <a href="javascript:OnLeftMenuSelection(59);">Opt 2</a></div>
            </span>
        </p>
    </div>
</div>

我在IE / Firefox中运行的Javascript很好，但在Chrome中失败了：

        function OnPageLoadCategorySelect(Category) {            
        var Root = $j('#ctl00_LeftNav').children();
        var Tab = 0;
        for (var i = 1; i < Root.length; i += 2) {
            var Menu = Root[i].firstChild.firstChild.childNodes;                
            var MenuLength = Menu.length;
            for (var j = 0; j < Menu.length; j++) {
                var Link = Menu[j].innerHTML;
                var Start = Link.indexOf('(');
                var End = Link.indexOf(')');
                var Res = Link.slice(Start + 1, End);
                if (Res == Category) {
                    SelectedTabIndex = Tab;                        
                    OnLeftMenuSelection(Category);
                    $j('#ShopTabs').show();
                    $j('#ctl00_LeftNav').accordion('activate', Tab);                      
                    return;
                }
            }                
            Tab++;                
        }
    }

在Chrome中，第二个for循环永远不会执行，因为Menu.length为零。获得这些内部div的最佳方法是什么？

解决方案

function OnPageLoadCategorySelect(Category) {
$j("#ctl00_LeftNav > div").each(function(Tab, el) {
            $j('a', this).each(function() {
                var id = $j(this).attr('href').replace('javascript:OnLeftMenuSelection(', '').replace(');', '');
                if (id == Category) {
                    SelectedTabIndex = Tab;
                    OnLeftMenuSelection(Category);
                    $j('#ShopTabs').show();
                    $j('#ctl00_LeftNav').accordion('activate', Tab);
                    return false; // exit the loop
                }
            })
        });
 }

Answer 1

你应该考虑使用jQuery。

$('#ctl00_LeftNav').children("div").each(function(index) {

   alert(index + ': ' + $(this).text()); // displays inner text of div

});

或者这会得到patrick

指出的选择器的所有子div

$('#ctl00_LeftNav > div').each(function(index) {

   alert(index + ': ' + $(this).text()); // displays inner text of div

});

来源：here for loops

Answer 2

如果我正确理解您的代码，请用以下代码替换整个函数：

function OnPageLoadCategorySelect(Category) {
  $j("#ctl00_LeftNav > div").each(function(Tab, el){
      $j('a', this).each(function(){
          var id = $j(this).attr('href').replace('javascript:OnLeftMenuSelection(','').replace(')','');
          if( id == Category ) {
              SelectedTabIndex = Tab;                        
              OnLeftMenuSelection(Category);
              $j('#ShopTabs').show();
              $j('#ctl00_LeftNav').accordion('activate', Tab);                      
              return false; // exit the loop
          }
      })
  });
}

each函数的第一个参数是基于零的索引。通过提供Tab，它会为您计算。

Chrome / Correct中的childNodes.length 0在IE＆amp; FF

2 个答案: