Question

我一直在阅读有关getElmentByClassName的内容，但我似乎无法在任何浏览器中使用它，我调用ID名称时可以使用的功能，但我希望能够调用类名。

有没有办法不包括Jquery？

这就是我所拥有的，在一些帮助下会很棒。感谢。

<ul><li><button class="testButton">Test button</button></li></ul>

function OnButtonDown (button) {
alert("The class work")
}

function Init () {
    var className = "testButton";
    var button = document.getElementsByClassName(className);
    if (button.addEventListener) {  // all browsers except IE before version 9
        button.addEventListener ("mousedown", function () {
            OnButtonDown (button)
            }, false);
        button.addEventListener ("mouseup", function () {
            OnButtonUp (button)
            }, false);
    }
    else {
        if (button.attachEvent) {   // IE before version 9
            button.attachEvent ("onmousedown", function () {
                OnButtonDown (button)
                });
            button.attachEvent ("onmouseup", function () {
                OnButtonUp (button)
                });
        }
    }
}

Answer 1

getElementsByClassName()返回HTML元素的集合，您需要使用它们的索引访问集合的元素：

button = document.getElementsByClassName(className)[0];
// your code here

如果您只有一个元素，请考虑使用.getElementById()。

Answer 2

@micnic说的话。

FYI。在document.getElementById() 不为您工作的情况下，以下是您将如何处理它：

var button = false;
var buttons = document.getElementsByClassName(className);
for (var i=0; i<buttons.length; i++) {
    button = buttons[i];
    // do stuff with button
}

在这里演示：http://jsfiddle.net/3pAeM/

如何使getElementsByClassName工作

2 个答案: