使用Jquery从div开始循环遍历li ul中的href标签答案

【问题标题】：Loop through a href tags in a li ul starting from a div using Jquery使用Jquery从div开始循环遍历li ul中的href标签
【发布时间】：2013-07-09 05:13:06
【问题描述】：

如何遍历每个 a href 元素，然后从 div Foo 开始的 href 中获取文本。

基本上我想遍历值 Hello、World、Acc、Sale 等。

<div id="Foo">
   <div class="Moo">
      <ul>
         <li>
            <a href="http://www.test.com/b5">Hello</a>
         </li>
         <li>
            <a href="http://www.test.com/b6">World</a>
         </li>
         <li>
            <a href="http://www.test.com/b7">Acc</a>
         </li>
         <li>
            <a href="http://www.test.com/b8">Sale</a>
         </li>
      </ul>
   </div>
</div>

啊啊啊这个语言让我发疯了。这怎么行不通？我基本上是指着对象说循环遍历每个 A。

$('#Foo').find('.Moo ul li').find('a').each(function(){
   alert($(this).text);
});

这也不行。

$('#Foo.Moo ul li a').each(function(){
   alert($(this).text);
});

也不是，他们只是不断返回 javascript 而不是 a 标签的值。

('#Foo .Moo ul li a').each(function(){  
   alert($(this).text);
});

【问题讨论】：

您只是在函数名之后缺少() 来调用该函数。这是基本的编程语法。

标签： jquery html

【解决方案1】：

试试看

$("#Foo .Moo ul li a").each(function(){
     alert($(this).text());
});

从你的代码中可能会喜欢

$('#Foo').find('.Moo ul li').find('a').each(function(){
   alert($(this).text());
});

它会像 .text() 不像 .text 并且像你的 html 一样

<div id="Foo">
<div class="Moo">
    <ul>
        <li>
        <a href="http://www.test.com/b5">Hello</a>
        <ul>                
            <li>
            <a href="http://www.test.com/b6">World</a>
            </li>
            <ul>
                <li>
                <a href="http://www.test.com/b7">Acc</a>
                </li>
                <li>
                <a href="http://www.test.com/b8">Sale</a>
                </li>
            </ul>
           </ul>
           </li>
         </ul>
        </div>
    </div>

【讨论】：

他的 html 无效。你的解决方案不会有帮助
伙计，我真的需要一个超级快速的编辑器来纠正这些问题。 Netbeans 需要很长时间才能打开。
让它一直运行，就像我使用 PhpStorm 一样。

【解决方案2】：

您的 html 无效

<div id="Foo">
    <div class="Moo">
        <ul>
            <li>
            <a href="http://www.test.com/b5">Hello</a>
            <ul>
                </li>
                <li>
                <a href="http://www.test.com/b6">World</a>
                <ul>
                    </li>
                    <li>
                    <a href="http://www.test.com/b7">Acc</a>
                    </li>
                    <li>
                    <a href="http://www.test.com/b8">Sale</a>
                    </li>
                </ul>
            </div>
        </div>

这可能是原因。

修复它然后重新询问。

那么你可以这样做：

$('#Foo .Moo ul li a').each(function(){
   alert($(this).text());
});

【讨论】：

但是你的JS还是错了。 text 不是属性而是函数。
@mohkhan 是的。（这就是粘贴太快时发生的情况）:)

【解决方案3】：

你的 HTML 无效，所以这不起作用。去掉中间不需要的<ul>：

<div id="Foo">
    <div class="Moo">
        <ul>
            <li>
<a href="http://www.test.com/b5">Hello</a>

            </li>
            <li>
<a href="http://www.test.com/b6">World</a>

            </li>
            <li>
<a href="http://www.test.com/b7">Acc</a>

            </li>
            <li>
<a href="http://www.test.com/b8">Sale</a>

            </li>
        </ul>
    </div>
</div>

然后您可以使用map() 遍历<a> 并获取文本，并将其存储在一个数组中。

var aText = $("#Foo a").map(function () {
    return this.innerHTML;
}).get();
alert(JSON.stringify(aText)); //not needed. You could access that text like this : aText[i] where i = 0|1|2

演示：http://jsfiddle.net/hungerpain/WG2Hg/

【讨论】：