javascript - 如何使用jquery获取多个相同类名的span值

Question

当存在多个相同的类名时，使用 JQuery 中的 for 循环获取跨度值

我有下面的代码来尝试使用 JQuery 中的循环获取 span 元素的值。

我如何才能返回:英语、印地语、ABCD、Laravel 和卡纳达语。

$(() => {
  var skil = $('.language-list .keyword-text');
  alert(skil.length);
  var skills = new Array();
  for(var i=0;i<skil.length;i++){
    skills.push($(this).$('skil')[i]);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row p-3  mb-4 keywords-list language-list">
  <span class="keyword">
    <span class="keyword-remove " ></span>
    <span class="keyword-text b p-2 text-black">English</span>
  </span>
  <span class="keyword">
    <span class="keyword-remove " ></span>
    <span class="keyword-text b p-2 text-black">Hindi</span>
  </span>
  <span class="keyword">
    <span class="keyword-remove " ></span>
    <span class="keyword-text b p-2 text-black">ABCD</span>
  </span>
  <span class="keyword">
    <span class="keyword-remove " ></span>
    <span class="keyword-text b p-2 text-black">Laravel</span>
  </span>
  <span class="keyword">
    <span class="keyword-remove " ></span>
    <span class="keyword-text b p-2 text-black">kannada</span>
  </span>
</div>

Answer 1

您可以使用$.each迭代每个跨度:

var skil = $('.language-list .keyword-text');
var skills = new Array();
skil.each(function(i) {
  skills.push($(this).text());
});
console.log(skills);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row p-3  mb-4 keywords-list language-list">
  <span class="keyword">
  <span class="keyword-remove " ></span>
  <span class="keyword-text b p-2 text-black">English</span>
  </span>
  <span class="keyword"><span class="keyword-remove " ></span><span class="keyword-text b p-2 text-black">Hindi</span></span>
  <span class="keyword"><span class="keyword-remove " ></span><span class="keyword-text b p-2 text-black">ABCD</span></span>
  <span class="keyword"><span class="keyword-remove " ></span><span class="keyword-text b p-2 text-black">Laravel</span></span>
  <span class="keyword"><span class="keyword-remove " ></span><span class="keyword-text b p-2 text-black">kannada</span></span>
</div>