javascript - TypeError : $(. ..)[1].attr 不是函数

Question

我有这样设置的链接:

HTML:

<a href="www.example1.com" class="some-link">
<a href="www.example2.com" class="some-link">
<a href="www.example3.com" class="some-link">
<a href="www.example4.com" class="some-link">

我想得到 href那就是<a>标签包含。我尝试像这样遍历每个链接:

Javascript/jQuery:

for (x=0; x < 5; x++) {
  link = $(".some-link")[x].attr("href");
  console.log(link);
}

当我尝试这个时，我收到错误 TypeError: $(...)[x].attr is not a function .有什么问题？谢谢。

Answer 1

您需要使用 eq() 这里，因为 $(".some-link")[x] 返回 dom 对象 attr() 方法只能与 jQuery 对象一起使用。所以你需要使用 eq(x) 或 :eq()

for (x=0; x < 5; x++) {
   link = $(".some-link").eq(x).attr("href");
   console.log(link);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a href="www.example1.com" class="some-link">
<a href="www.example2.com" class="some-link">
<a href="www.example3.com" class="some-link">
<a href="www.example4.com" class="some-link">
<a href="www.example4.com" class="some-link">

或者您可以使用 each() 方法代替

$(".some-link").each(function(){
   var link=$(this).attr("href");
   console.log(link);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a href="www.example1.com" class="some-link">
<a href="www.example2.com" class="some-link">
<a href="www.example3.com" class="some-link">
<a href="www.example4.com" class="some-link">
<a href="www.example4.com" class="some-link">

或更简单的方法使用 attr() 带回调

$(".some-link").attr("href",function(i,link){
   console.log(link);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a href="www.example1.com" class="some-link">
<a href="www.example2.com" class="some-link">
<a href="www.example3.com" class="some-link">
<a href="www.example4.com" class="some-link">
<a href="www.example4.com" class="some-link">