使用 JavaScript，我们可以使用以下语法通过 id 获取元素：
var x=document.getElementById("by_id");
我尝试以下按类获取元素：
var y=document.getElementByClass("by_class");
但它导致了错误：
getElementByClass is not function
如何按类获取元素？
问问题
535087 次
4 回答
268
DOM 函数的名称实际上是getElementsByClassName，而不是getElementByClassName，仅仅是因为页面上的多个元素可以具有相同的类，因此：Elements。
this 的返回值将是一个 NodeList 实例，或者是NodeList（FF，例如返回 的实例HTMLCollection）的超集。无论如何：返回值是一个类似数组的对象：
var y = document.getElementsByClassName('foo');
var aNode = y[0];
如果由于某种原因您需要将返回对象作为一个数组，您可以很容易地做到这一点，因为它具有魔长属性：
var arrFromList = Array.prototype.slice.call(y);
//or as per AntonB's comment:
var arrFromList = [].slice.call(y);
根据 caniuse.com 的说法，正如yckart 所建议的那样querySelector('.foo')，并且querySelectorAll('.foo')会更可取，因为它们确实得到了更好的支持（93.99% 对 87.24%）：
于 2013-07-31T09:01:24.883 回答
59
另一种选择是使用querySelector('.foo')或querySelectorAll('.foo')具有比getElementsByClassName.
于 2013-07-31T09:02:51.483 回答
29
您需要使用document.getElementsByClassName('class_name');
并且不要忘记返回的值是一个元素数组，所以如果你想要第一个使用：
document.getElementsByClassName('class_name')[0]
更新
现在您可以使用：
document.querySelector(".class_name")获取具有class_nameCSS 类的第一个元素（null如果页面上的元素没有此类名称，则将返回）
或document.querySelectorAll(".class_name")使用css类获取元素的NodeList class_name（如果不是，则返回空的NodeList。页面上的元素具有此类名称）。
于 2013-07-31T09:04:00.070 回答
8
您可以使用
getElementsByClassName
假设你有一些元素并应用了一个类名“test”，那么你可以获得如下元素
var tests = document.getElementsByClassName('test');
它返回一个实例NodeList，或者它的超集：HTMLCollection(FF)。
于 2013-07-31T09:02:40.387 回答