Question

如何在纯javascript上按类名获取所有元素？ Jquery中的模拟$（'。class'）？

Answer 1

document.getElementsByClassName(klass)

请注意，某些引擎（尤其是较旧的浏览器）没有它。如果是这种情况，您可以考虑使用垫片。它会很慢，并且遍历整个文档，但它会起作用。

Answer 2

一种简单易行的方法

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';
}

Answer 3

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
    }
}

Answer 4

在some browsers中有document.getElementsByClassName(class)个功能。否则，您唯一的选择是通过根据您具有所需类名的条件检查每个元素来迭代文档中的所有元素。

Answer 5

这应该有效：

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;
}

Answer 6

这里描述了几种技术并进行了速度测试：http://ejohn.org/blog/getelementsbyclassname-speed-comparison/

Answer 7


function getElementsByClassName(oElm, strTagName, strClassName){
    var arrElements = (strTagName == "*" && oElm.all)? oElm.all :
        oElm.getElementsByTagName(strTagName);
    var arrReturnElements = new Array();
    strClassName = strClassName.replace(/\-/g, "\\-");
    var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
    var oElement;
    for(var i=0; i<arrElements.length; i++){
        oElement = arrElements[i];     
        if(oRegExp.test(oElement.className)){
            arrReturnElements.push(oElement);
        }   
    }
    return (arrReturnElements)
}

如何按类名获取所有元素？

7 个答案: