jquery 问题请教

Question

js代码如下

$('.vertical-carousel-list').find('li').each(function(index, domEle){
          console.log($(this).html());    
          var src = $(this).attr('href');
          console.log(src);
  });

控制台输出src 是 undefine ， 这个为什么， 要怎么取得li元素中的href元素呢？

Answer 1

<ul class="vertical-carousel-list">
    <li><a href="http://www.baidu.com">baidu</a></li>
    <li><a href="other">other</a></li>
</ul>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        var srcs = [];

        $('.vertical-carousel-list').find('li').each(function(index, domEle){
          srcs.push($(this).find('a').attr('href'));
        });

        console.log(srcs); //["http://www.baidu.com", "other"]
    })
</script>

Answer 2

li元素啥时候有href属性了……如果是找a元素的话改下find的参数，如果是自定义属性的话推荐用data-

Answer 3

$('.vertical-carousel-list li').find('a').each(function(){ 
var src = $(this).attr('href');
console.log(src);
});

Answer 4

你这段代码里的 this 指向的是 li ，li 标签里是没有 href 属性的。
应该获取到 a 标签以后再查找。
$(this).html() 打印出来的是 this 包裹的元素，而不包括它本身。