javascript如何实现点击按钮变色
导读：本文共804字符，通常情况下阅读需要3分钟。同时您也可以点击右侧朗读，来听本文内容。按键盘←（左） →（右） 方向键可以翻页。
摘要： 效果如下:代码如下:在这个案例中主要用到的是排他思想html部分输入我们所需要的按钮个数<button>按钮1</button><button>按钮2</button><button>按钮3</button><button>按钮4</button><bu... ...
音频解说
目录
(为您整理了一些要点),点击可以直达。效果如下:
代码如下:
在这个案例中主要用到的是排他思想
html部分
输入我们所需要的按钮个数
<button>按钮1</button><button>按钮2</button><button>按钮3</button><button>按钮4</button><button>按钮5</button>
css部分
<styletype="text/css">button{border:1pxsolidcornflowerblue;border-radius:3px;margin-left:14px;}</style>script部分
<scripttype="text/javascript">//获取所有按钮元素varbtns=document.getElementsByTagName("button");//btns得到的值是一个伪数组,里面的每一个button元素都为btns[i]//console.log(btns);//对数组进行遍历for(vari=0;i<btns.length;i++){//给每一个button按钮绑定点击事件btns[i].onclick=function(){//先把所有的颜色全部清空for(vari=0;i<btns.length;i++){btns[i].style.backgroundColor="";}//再把当前元素的背景颜色添加上this.style.backgroundColor="pink";}}</script> </div> <div class="zixun-tj-product adv-bottom"></div> </div> </div> <div class="prve-next-news">本文：
javascript如何实现点击按钮变色的详细内容，希望对您有所帮助，信息来源于网络。