点击一个按钮，所有按钮都变颜色

最新推荐文章于 2023-12-25 21:18:04 发布

原创最新推荐文章于 2023-12-25 21:18:04 发布 · 1.5k 阅读

1 ·

CC 4.0 BY-SA版权

js 专栏收录该内容

98 篇文章

订阅专栏

本文介绍了一个简单的HTML和JavaScript实现的功能，当点击任一按钮时，页面上所有的按钮背景颜色都会变为黄色。通过此实例，读者可以了解到如何使用JavaScript操作DOM元素来改变其样式。

这里写图片描述

点击任意一个按钮，所有按钮的背景颜色都变。

html：

<input type="button" value="按钮1">
<input type="button" value="按钮2">
<input type="button" value="按钮3">

js：

var btn = document.getElementsByTagName('input');//获取按钮
for(var i=0;i<btn.length;i++){//遍历按钮
    btn[i].onclick = function(){
        for(var i=0;i<btn.length;i++){
            btn[i].style.backgroundColor = 'yellow';
        }
    }
}