我试图使用 onclick 和 getElementsByClassName 更改按钮的颜色,并想出了这样的结果:
HTML:
<button onclick="submitButtonStyle()" type="submit" class="stylebutton">
Submit </button>
JS:
function submitButtonStyle() {
document.getElementsByClassName("stylebutton").style.backgroundColor = "red"; }
如果你们给我一些关于我的代码中缺少什么/我应该添加什么等的提示,我将非常感激。
getElementsByClassName
返回一个HTMLCollection
所以你需要使用索引来获取元素,在你的情况下index === 0getElementsByClassName[0]
.
实际上,您不需要调用该函数getElementsByClassName
,将元素作为参数传递。
function submitButtonStyle(_this) {
_this.style.backgroundColor = "red";
}
<button onclick="submitButtonStyle(this)" type="submit" class="stylebutton">
Submit </button>
使用事件绑定和函数的更好方法querySelectorAll
document.querySelectorAll('.stylebutton').forEach(function(e) {
e.addEventListener('click', function() {
this.style.backgroundColor = "red";
})
});
<button type="submit" class="stylebutton"> Submit </button>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)