jQuery - 遍历嵌套元素
jQuery - Loop through nested elements
我有多个具有相同 class 名称 (listing_class
) 的 div
元素。我需要的是分别获取所有 div
元素中每个锚标记的 href
值。
var length = $(".listing_class").length;
for (var i = 0; i < length; i++) {
$(".listing_class").each(function() {
console.log($(this).children('a').attr('href'));
});
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="listing_class " style="display: none;">
<a href="?section=all&status=active" class="active"> All Listings</a>
<a href="?section=sale&status=active" class="active"> For Sale (0)</a>
<a href="?section=rent&status=active" class="active"> For Rent (0)</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=a&status=p" class="active"> a</a>
<a href="?section=b&status=p" class="active"> b</a>
<a href="?section=c&status=p" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=QQ&status=FF" class="active"> a</a>
<a href="?section=FF&status=FF" class="active"> b</a>
<a href="?section=VV&status=FF" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=WW&status=p"> VV</a>
<a href="?section=WW&status=p"> CC</a>
<a href="?section=WW&status=p"> AQ</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=A&status=p"> VV</a>
<a href="?section=B&status=p"> CC</a>
<a href="?section=X&status=p"> AQ</a>
</div>
问题是,它 returns 仅锚定第一个 div 的值,不会进一步循环。
提前致谢。
基本上更好的解决方案是找到 .list_class
class 下的所有 a
元素,如果您使用以下 jQuery
选择器 $('.listing_class a')
所有 a
标签。然后这可以用来遍历所有必要的项目并获得每个元素的 href
属性。
也许您可以尝试以下方法:
$('.listing_class a').each(function(lc) {
console.log($(this).attr('href'));
});
<div class="listing_class " style="display: none;">
<a href="?section=all&status=active" class="active"> All Listings</a>
<a href="?section=sale&status=active" class="active"> For Sale (0)</a>
<a href="?section=rent&status=active" class="active"> For Rent (0)</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=a&status=p" class="active"> a</a>
<a href="?section=b&status=p" class="active"> b</a>
<a href="?section=c&status=p" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=QQ&status=FF" class="active"> a</a>
<a href="?section=FF&status=FF" class="active"> b</a>
<a href="?section=VV&status=FF" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=WW&status=p" > VV</a>
<a href="?section=WW&status=p" > CC</a>
<a href="?section=WW&status=p" > AQ</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=A&status=p"> VV</a>
<a href="?section=B&status=p"> CC</a>
<a href="?section=X&status=p"> AQ</a>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
希望对您有所帮助!
我有多个具有相同 class 名称 (listing_class
) 的 div
元素。我需要的是分别获取所有 div
元素中每个锚标记的 href
值。
var length = $(".listing_class").length;
for (var i = 0; i < length; i++) {
$(".listing_class").each(function() {
console.log($(this).children('a').attr('href'));
});
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="listing_class " style="display: none;">
<a href="?section=all&status=active" class="active"> All Listings</a>
<a href="?section=sale&status=active" class="active"> For Sale (0)</a>
<a href="?section=rent&status=active" class="active"> For Rent (0)</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=a&status=p" class="active"> a</a>
<a href="?section=b&status=p" class="active"> b</a>
<a href="?section=c&status=p" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=QQ&status=FF" class="active"> a</a>
<a href="?section=FF&status=FF" class="active"> b</a>
<a href="?section=VV&status=FF" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=WW&status=p"> VV</a>
<a href="?section=WW&status=p"> CC</a>
<a href="?section=WW&status=p"> AQ</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=A&status=p"> VV</a>
<a href="?section=B&status=p"> CC</a>
<a href="?section=X&status=p"> AQ</a>
</div>
问题是,它 returns 仅锚定第一个 div 的值,不会进一步循环。
提前致谢。
基本上更好的解决方案是找到 .list_class
class 下的所有 a
元素,如果您使用以下 jQuery
选择器 $('.listing_class a')
所有 a
标签。然后这可以用来遍历所有必要的项目并获得每个元素的 href
属性。
也许您可以尝试以下方法:
$('.listing_class a').each(function(lc) {
console.log($(this).attr('href'));
});
<div class="listing_class " style="display: none;">
<a href="?section=all&status=active" class="active"> All Listings</a>
<a href="?section=sale&status=active" class="active"> For Sale (0)</a>
<a href="?section=rent&status=active" class="active"> For Rent (0)</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=a&status=p" class="active"> a</a>
<a href="?section=b&status=p" class="active"> b</a>
<a href="?section=c&status=p" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=QQ&status=FF" class="active"> a</a>
<a href="?section=FF&status=FF" class="active"> b</a>
<a href="?section=VV&status=FF" class="active"> c</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=WW&status=p" > VV</a>
<a href="?section=WW&status=p" > CC</a>
<a href="?section=WW&status=p" > AQ</a>
</div>
<div class="listing_class " style="display: none;">
<a href="?section=A&status=p"> VV</a>
<a href="?section=B&status=p"> CC</a>
<a href="?section=X&status=p"> AQ</a>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
希望对您有所帮助!