javascript - 选择以 "data-"开头的元素

Question

我如何使用计划 javascript 或 jQuery 选择每个具有以“data-”开头的属性的元素？

我试过了

 $("[data-*"])

但它不起作用。

Answer 1

这是一个非 JQuery 函数，它将执行您需要的操作:

function getAllDataElements() {
    //get all DOM elements
    var elements = document.getElementsByTagName("*");
    //array to store matches
    var matches = [];
    //loop each element
    for (var i = 0; i < elements.length; i++) {
        var element = elements[i];
        //get all attributes for the element and loop them
        var attributes = element.attributes;
        for (var j = 0; j < attributes.length; j++) {
            //get the name of the attribute
            var attr = attributes.item(j).nodeName;
            //check if attibute name starts with "data-"
            if (attr.indexOf("data-") == 0) {
                matches.push(element); //add it to matches
            }
        }
    }
    return matches; //return results
}

可以这样使用:

var results = getAllDataElements();

results.forEach(function (i) {
    i.style.color = "#FF0000";
});

Here is a working example