排他性：先去掉所有，再绑定自身
<script> var inputs=document.getElementsByTagName('input'); for (var i = 0; i <inputs.length; i++) { inputs[i].onclick=function () { //利用排他性先去掉所有按钮 for (var i = 0; i <inputs.length; i++) { inputs[i].className="";// }; this.className="castom";//此时绑定的是每个按钮 } }; </script>专门用来操作标签属性的方法：获取，设置，移除
<script> var box=document.getElementById('box'); //专门用来操作标签属性的方法 //获取 任何标签中的属性都可以获取getAttribute("属性名") console.log(box.getAttribute("a")); //设置 任何标签中的属性都可以设置setAttribute("属性名"，"属性值") box.getAttribute("class","cls"); //移除 任何标签中的属性都可以移除 box.removeAttribute("a"); </script>tab栏切换效果：
<script> var box=document.getElementById('box'); var spans=box.getElementsByTagName('spans'); var lis=box.getElementsByTagName('li'); //点击span让当前span高亮 for (var i = 0; i <spans.length; i++) { //spans[i].index=i;//自定义属性 spans[i].setAttribute("index",i); spans[i].onclick=function () { //排他 //干掉所有人 for (var i = 0; i <spans.length; i++) { //spans[i].className=""; spans[i].removeAttribute("class"); }; //this.className="current";//留下自己 this.setAttribute("class","current"); //让下面对应的li也显示出来 for (var i = 0; i <lis.length; i++) { //lis[i].className=""; lis[i].removeAttribute("class"); }; //var index=this.index; var index=this.getAttribute("index"); //lis[index].className="current"; lis[index].setAttribute("class","current"); } }; </script>