jQuery在嵌套divds中选择href值

时间:2013-11-06 19:42:53

标签: javascript jquery selection href attr

虽然我找到了几个选择href属性的答案,但它们都不适用于我。也许有人可以提供帮助。

html如下

<div class="galleryitem">
   <div class="itemlink">
      <a href="page1.html">Page</a>                 
   </div>
   <div class="itemimg">
      <a href="img/test1.png">test1.png</a>                 
   </div>
</div>

<div class="galleryitem">       
   <div class="itemlink">
    <a href="page1.html">Page 1</a>                 
   </div>
   <div class="itemimg">
      <a href="img/test2.png">test2.png</a>                 
   </div>
</div>

现在我想知道hrefs中的所有属性值并尝试使用

$('.galleryitem').each(function() {

   var link = $(this).children('itemlink a').attr('href');
   var img = $(this).children(".itemimg a").attr("href");       

   //jQuery("#somediv").append("<a href='" + link + "'><img class='cloudcarousel' src='" + img + "'/></a>");

});

我不知道为什么链接和img未定义。即使$(this).children('。itemlink a')也未定义。

有人可以为此提供帮助吗?

3 个答案:

答案 0 :(得分:2)

尝试使用find

$('.galleryitem').each(function() {
    var link = $(this).find('itemlink a').attr('href');
    var img = $(this).find(".itemimg a").attr("href"); 
    //...
})

答案 1 :(得分:2)

你想要确保.find()方法而不是.children只能抓住直接后代的方法。 (您还有一个小错误,错过了itemlink

中的句号
var link = $(this).find('.itemlink a').attr('href');
var img = $(this).find(".itemimg a").attr("href");       

应该对你有用,这是一个小提琴:http://jsfiddle.net/hQeu3/

.children不起作用的原因是没有与此选择器'.itemlink a'匹配的直接后代。 jQuery抓取div(“.itemlink”),然后尝试过滤到选择器,在这种情况下失败。它基本上等于

$(this).children().filter('.itemlink a'); //won't work!

如果你想使用你可以做的孩子

$(this).children('.itemlink').children("a").attr('href');

答案 2 :(得分:1)

你可以这样做:

$('.galleryitem').each(function() {

   var link = $('.itemlink > a', this).attr('href');
   var img = $('.itemimg > a', this).attr('href');
});

考虑到.itemlink.itemimg<a>元素的直接父级。