Question

我有一个名为WatchMode的按钮。

当您单击此按钮时，它将关闭由div ID指定的某些div。

这个javascript如下：

function watchmode() { 
document.getElementById('aps30').innerHTML = " ";
}

现在，我想对我的页面上出现两次的div做同样的事情，这个div有一个Class而不是ID。

我尝试将此行添加到javascript中，但它似乎无法正常工作

document.getElementByClassName('floater').innerHTML = " ";

有什么建议吗？

Answer 1

你必须改变一些事情：

修复getElementsByClassName
将该函数调用的返回结果视为数组
循环返回数组的内容以便对结果进行操作
了解并非所有旧浏览器（IE9之前没有IE版本）都支持此功能，因此如果您想要定位旧浏览器，则可能必须检查其存在并使用替代实现（如果它本身不可用）。您可以看到浏览器支持here，并在Justin的答案中查看链接中的备用实现。

以下是代码：

var divs = document.getElementsByClassName('floater');
for (var i = 0; i < divs.length; i++) {
    divs[i].innerHTML = " ";
}

这是jQuery非常有用的地方。在jQuery中，它只是：

$(".floater").html(" ");

这将自动查找该类的所有对象，并将所有匹配对象的innerHTML设置为您的字符串。

Answer 2

首先，我不确定这是否是一个错字，但你提出：

document.get**Element**ByClassName('floater').innerHTML = " ";

命令实际上是：

document.get**Elements**ByClassName();

通知元素是复数。

现在，这与getElementById的行为不同。它返回一个节点列表，换句话说，返回具有指定类的所有元素的列表。

您可以将结果存储在如下数组中：

var array_name = document.getElementsByClassName('floater');

然后遍历结果以执行您的操作：

for ( var i=0, var len=array_name.length; i<len; ++i ){
    array_name[i].innerHtml = 'text';
}

我没有测试过我在这里写过的代码，但是方法是经过验证的。

[编辑] 我忘了提到IE不支持这个功能，你可以通过做类似的事来完成这个：$（'floater'）。html（'text'）;它是跨浏览器的。您还可以在Web上搜索模拟getElementsByClassName行为的内容，并在所有浏览器中使用。

这是一篇具有更好功能的文章，模仿getElementsByClassName：

http://www.webmuse.co.uk/blog/custom-getelementsbyclassname-function-for-all-browsers/

document.getElementsByClassName = function( classname ) {
    var elArray = [];
    var tmp = document.getElementsByTagName("*");
    var regex = new RegExp("(^|\s)" + classname + "(\s|$)");
    for ( var i = 0; i &lt; tmp.length; i++ ) {

        if ( regex.test(tmp[i].className) ) {
            elArray.push(tmp[i]);
        }
    }

    return elArray;
;

这非常有效，与浏览器兼容，并且使用与getElementsByClassName相同的方式。

文章中的用法示例： var el = document.getElementsByClassName（“para”）;

    for ( var i = 0; i &lt; el.length; i++ ) {
        el[i].style.color = "red";
    }

Answer 3

最简单的方法是使用jQuery。这是一篇应该回答你问题的帖子：

How to getElementByClass instead of GetElementById with Javascript?

Answer 4

您的函数名称有拼写错误 - 它应该是getElementsByClassName（注意复数，元素，而不是元素）：

document.getElementsByClassName('floater').innerHTML = " ";

逐个类而不是ID获取元素

4 个答案: