如何使用JavaScript和/或jQuery获取特定类中的所有元素数组？

Question

我想获取所有带有"class=sampleclass"的元素数组。例如，在我的文档中，我有三个div：

<div class="aclass"></div>
<div class="sampleclass"></div>
<div class="anotheraclass"></div>
<div class="sampleclass"></div>

我希望使用JavaScript和/或jQuery获取所有在“sampleclass”中的元素数组。有什么想法吗？

- Tomas Vinter

---

只是想澄清一下 - 您需要支持哪些浏览器？JQuery 应该支持大多数浏览器，但某些 DOM 方法不能在所有浏览器上工作。 - Russell

你想要sampleclass元素内的所有元素吗？如果是，那么问题中有一个错别字，大多数人回答错误。 - Alex Bagnolini

Answer 1

这将获取包含sampleclass类的每个元素中的所有元素：

var myArray = $('.sampleclass *');

* 被称为 All选择器

编辑: 请注意，在这个例子中:

<div id="test">
   <table>
      <tr><td>TEST</td></tr>
   </table>
</div>

var myArray = $('#test *');

myArray 包含 div 元素的所有子元素：table、tr 和 td。

如果你想获取给定元素内所有 顶级 元素，可以尝试使用以下代码：

var myArray = $('#test > *');

这个结合了子选择器和上述的全选选择器。

- Alex Bagnolini

Answer 2

$( '.sampleclass' );

然后您可以使用each迭代数组。

- Jacob Relkin

---

Jacob所说的。或者，不使用jQuery，document.getElementsByClassName('sampleclass'); - Matt Blaine

Answer 3

......

$('.sampleclass').........

接下来，您可以使用each迭代它，就像这样：

$('.sampleclass').each(function(){
  // more code........
})

最后，您也可以像这样获取每个单独的项目：

$('.sampleclass')[0]; // first
$('.sampleclass')[1]; // second
// and so on........

- Sarfraz

---

那段代码的性能很差，需要进行缓存以提高效率。 - Amy B

@Coronatus：你说复制粘贴这个词真是荒谬。我的回答比你的早发布了。这对我来说非常基本，所以我不需要复制粘贴。只需查看我的个人资料中的博客或者查看我在 jQuery 标签下的 SO 回答，就可以了解我的 jQuery 技能。请再考虑一下你的投票...谢谢。 - Sarfraz

@Coronatus：请问您的意思是什么？您有没有考虑过您所做的事情？ - Sarfraz

嘿嘿：http://meta.stackexchange.com/questions/44413/all-my-answers-being-downvoted-by-one-angry-user - Amy B

@Coronatus：你说“lol”，这并不是对我正确回答被踩的更好解释。我仍在等待你的解释。 - Sarfraz

Answer 4

扩展Jacob Relkin的答案：

$('.sampleClass').each(function()
{
   // do something with it...
   $(this).css('background-color', 'green');
});

- Amy B