javascript - getElementByClassName 不返回结果

Question

我getElementByClassName()没有返回任何结果，我将它设置为getElementById()，但我不能使用 ，Id因为相同的函数需要应用于七个链接。我已经填写了jsFiddle上的所有信息

javascript看起来像：

var myBoxWidth = 0;
var myBoxWidth2 = 0;

// show
function show() {
    var myBox = document.getElementByClassName('box');  
    var myContent = document.getElementByClassName('content');
    myContent.style.display = 'inline';
    myBox.style.width = myBoxWidth + '%';  
    if(myBoxWidth < 80) {  
        myBoxWidth += 20;
        setTimeout(show,55);
    }
}

// hide
function hide() {
    var myBox = document.getElementByClassName('box');
    var myContent = document.getElementByClassName('content');
    myContent.style.display = 'none';
    var currentWidthVal = parseInt(myBox.style.width,10);
    if(myBoxWidth2 < currentWidthVal) {  
        setTimeout(hide,55);
        myBox.style.width = currentWidthVal =  currentWidthVal - 20 + '%';
        myBoxWidth = 0;
    }
}

Answer 1

没有这样getElementByClassName()的。尝试getElementsByClassName()

更新

document.getElementsByClassName('..')在编写代码时返回一组元素，期望它将返回单个元素。你可以把那部分改成

var myContent = document.getElementsByClassName('content');

var num = myContent.length;

for(var x=0; x < num; x++){
    myContent[x].style.display = 'block'; //or whatever style you've in your original code 
}

Answer 2

它是 getElementsByClassName 而不是 getElementByClassName。我还建议使用 jQuery 或某种 js 框架。