javascript - jquery选择子元素的值

Question

这是我的html，我正在尝试获取“链接”的值

<li class="nav-parent nav-expanded">
   <a>
   <i class="licon-layers" aria-hidden="true"></i>
   <span>Virtual Servers</span>
   </a>
   <ul id="vms" class="nav nav-children" style="">
      <li value="0">
         <a link="i-2-20-VM">puppet-srv2</a>
      </li>
      <li value="0">
         <a link="i-2-18-VM">puppet-srv1</a>
      </li>
      <li value="0">
         <a link="i-2-24-VM">testing</a>
      </li>
   </ul>

这是我到目前为止所尝试过的，但它不起作用:

$("#vms").on("click", "li", function() {
   var href = $(this).children('a').find('link').attr();
    console.log(href);
});

我不确定我做错了什么，非常感谢您的帮助

Answer 1

您尝试使用 .find('link') 代码查找属性链接。由于子元素已经创建，因此只需使用 .attr() 捕获它的属性即可。相反，请尝试以下代码:

更改此:

var href = $(this).children('a').find('link').attr();

进入

var href = $(this).children('a').attr('link');

或者您也可以使用下面的代码:

$("#vms").on("click", "li", function() {
  var href = $(this).find('a').attr('link');
   console.log(href);
});

我读到了你的评论:

I'm using that just to hold value of VM name

如果是这样，您可以为用户定义的属性添加数据属性，如下所示:

<a data-link="i-2-20-VM">puppet-srv2</a>

然后要获取它的值，只需使用 .data()函数如下:

var href = $(this).find('a').data('link');