使用 JavaScript，我们可以使用以下语法通过 id 获取元素：
var x=document.getElementById("by_id");
我尝试了以下按类获取元素：
var y=document.getElementByClass("by_class");
但是结果报错了：
getElementByClass is not function
如何通过类获取元素？
【问题讨论】：
标签： javascript dom
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%）：
【讨论】：
NodeList 对象，它在很多方面表现得像一个数组，但有区别。 check the MDN documentation 了解返回类型的详细信息，以及它的规格
你可以使用
getElementsByClassName
假设你有一些元素并应用了一个类名'test'，那么你可以得到如下元素
var tests = document.getElementsByClassName('test');
它返回一个实例NodeList，或其超集：HTMLCollection (FF)。
【讨论】：
getElementsByClassName 返回一个数组，这是错误的。编辑您的答案并 +1 取消 -1 票
另一种选择是使用querySelector('.foo') 或querySelectorAll('.foo')，它们的浏览器支持比getElementsByClassName 更广泛。
【讨论】：
您需要使用document.getElementsByClassName('class_name');
并且不要忘记返回的值是一个元素数组，所以如果你想要第一个使用：
document.getElementsByClassName('class_name')[0]
更新
现在你可以使用了：
document.querySelector(".class_name") 获取第一个具有class_name CSS 类的元素（如果页面上没有任何元素具有此类名称，则将返回null）
或document.querySelectorAll(".class_name") 获取具有class_name css 类的元素的NodeList（如果不是，将返回空的NodeList。页面上的元素具有此类名称）。
【讨论】：
HTMLCollection，而不是Array dom.spec.whatwg.org/#dom-document-getelementsbyclassname ;)