Javascript 如何按类名获取所有元素?

Javascript 如何按类名获取所有元素?,javascript,Javascript,如何在纯javascript上按类名获取所有元素?Jquery中的模拟$('.class')? 请注意,某些引擎(尤其是较旧的浏览器)没有它。如果情况确实如此,你可以考虑使用垫片。它会很慢,并且会遍历整个文档,但它会起作用 EDIT几年后:您可以使用获得相同的结果,这似乎不太常见,但后者允许在任何CSS选择器上进行查询,这使得它更加灵活,以防“按类名获取所有元素”只是您真正尝试做的一步,并且是jQuery的$('.class')的普通JS答案中有一个文档。getElementsByClassNa

如何在纯javascript上按类名获取所有元素?Jquery中的模拟$('.class')?

请注意,某些引擎(尤其是较旧的浏览器)没有它。如果情况确实如此,你可以考虑使用垫片。它会很慢,并且会遍历整个文档,但它会起作用

EDIT几年后:您可以使用获得相同的结果,这似乎不太常见,但后者允许在任何CSS选择器上进行查询,这使得它更加灵活,以防“按类名获取所有元素”只是您真正尝试做的一步,并且是jQuery的
$('.class')的普通JS答案

中有一个
文档。getElementsByClassName(类)
函数。否则,您唯一的选择就是通过检查文档中的每个元素是否具有所需的类名来迭代文档中的所有元素

document.getElementsByClassName('your class');  
或者你可以像这样构建你的类名,如果这样不行,试试这个

if (!document.getElementsByClassName) {
    document.getElementsByClassName=function(cn) {
        var allT=document.getElementsByTagName('*'), allCN=[], i=0, a;
        while(a=allT[i++]) {
            a.className==cn ? allCN[allCN.length]=a : null;
        }
        return allCN
    }
}
这应该起作用:

function(className)
{
    var matchingItems = [];
    var allElements = document.getElementsByTagName("*");

    for(var i=0; i < allElements.length; i++)
    {
        if(allElements [i].className == className)
        {
            matchingItems.push(allElements[i]);
        }
    }

    return matchingItems;
}
函数(类名)
{
var matchingItems=[];
var-allegements=document.getElementsByTagName(“*”);
对于(var i=0;i

函数getElementsByClassName(oElm、strTagName、strClassName){
变量欠款=(strTagName=“*”&&oElm.all)?oElm.all:
oElm.getElementsByTagName(strTagName);
var arrrurnelements=新数组();
strClassName=strClassName.replace(/\-/g,“\\-”);
var oRegExp=new RegExp(“(^ | \\s)”+strcassname+”(\\s |$)”;
变异元素;

对于(var i=0;i这里描述了几种技术并测试了速度:

一种简单易行的方法

var cusid_ele = document.getElementsByClassName('custid');
for (var i = 0; i < cusid_ele.length; ++i) {
    var item = cusid_ele[i];  
    item.innerHTML = 'this is value';
}
var cusid_ele=document.getElementsByClassName('custid');
对于(变量i=0;i
是的,但我不建议这样使用它,我曾经尝试过这样做,然后我在IE7中遇到了一个巨大的性能问题,因为它运行得非常慢。我同意。肯定有更优雅的解决方案。我看到@Kunal下面使用的是更干净的正则表达式。我只是提供了一个快速选项,以便请求者可以有个主意。如果两个类应用于元素,这将不起作用。这看起来类似于Site Point book中的代码片段。只是想知道这是源代码,还是只是奇怪的巧合?前进时,如果元素在循环中被删除,循环将跳过每一个条目。因此,最好向后走。(我相应地编辑了答案,等待同行审查。)
var cusid_ele = document.getElementsByClassName('custid');
for (var i = 0; i < cusid_ele.length; ++i) {
    var item = cusid_ele[i];  
    item.innerHTML = 'this is value';
}