使用find方法从每个li获取href属性值

Question

我有一个导航菜单，想要从每个href

获取 li a属性

jQuery代码

$('#navbar ul li').each(function(){
     console.log($('a').attr('href'));
});

菜单的HTML代码

<div id="navbar">
<ul class="sf-menu sf-js-enabled" id="navmain">
<li><a href="/index.php">HOME</a></li>
<li><a href="/shop/sales/">SALES</a></li>
<li><a href="/shop/clothing/">CLOTHING</a></li>
<li><a href="/shop/accessories/">ACCESSORIES</a></li>
<li><a href="/cart.php">CART</a></li>
<li><a href="/wishlist.php">WISHLIST</a></li>
<li><a href="/contactus.php">CONTACT US</a></li>
<li><a href="/aboutus.php">ABOUT US</a></li>
</ul>
</div>

Answer 1

$('#navbar > ul > li').each(function () {
    console.log($(this).children('a').attr('href'));
});

或者

$('#navbar > ul > li > a').each(function () {
    console.log(this.href);
});

但是为了解决问题，我会这样做：

$('#navbar a').each(function () {
    console.log(this.href);
});

请注意，最后一个适用于#navbar中的所有链接，而不仅仅是#navbar中无序列表中列表项内的链接。

Answer 2

$('#navbar ul li a').each(function(){
    console.log($(this).attr('href'));
});

---

顺便说一下，你确定需要那个复杂的选择器吗？这还不够吗？

$('#navbar a').each(function () {
    console.log( this.getAttribute('href') );
});