更改html action =; quot; quot;使用JavaScript

Question

我如何在使用

中更改action =" soming"字符串

document.getElementsByClassName

，但似乎并没有改变任何东西。

我的html

......
.........
<div class="my_button button" action='play_car'></div>
 .....
......

我的javascript

document.getElementsByClassName('my_button').action = "play_boat";
.......
......

我也尝试了html

<div id="test" class="my_button button" action='play_car'></div>

javascript

   var a= document.getElementById('test');
   console.log(a);

它只是返回null

Answer 1

"获取元素 - s by class Name"返回一个集合，而不是一个元素。

返回所有具有给定类名的子元素的数组。在文档对象上调用时，搜索了完整的文档，包括根节点。

假设只返回一个元素，则：

var elementsWithClass = document.getElementsByClassName('my_button')
elementsWithClass[0].action = "play_boat";

但是，使用循环可能更合适 - 类名称通常是与多个元素一起使用的，以及用于单数/唯一元素的ID（以及getElementById）。

不幸的是，即使在"最近"的浏览器中，getElementsByClassName在IE8中也不支持。要处理此操作，请使用跨浏览器库（jQuery或您的喜好）或polyfill。

Answer 2

getElementsByClassName将返回所有元素的数组。如果要仅处理一个元素，请使用document.getElementById。同样，GetElementsByClassName不受较旧的浏览器的支持。如果这是一个问题，则可以使用jQuery。

Answer 3

如果您只有一个具有此类名称的元素，则可以获得第一个项目：

document.getElementsByClassName('my_button')[0].action = "play_boat";

如果您有很多，请迭代它们：

for (var i in document.getElementsByClassName('my_button')) {
    document.getElementsByClassName('my_button')[i].action = "play_boat"; 
}

请检查JavaScript代码的位置是否在类" my_button"的元素之后。