Hello，在经由一系列困难的决议以后，我开出了这么一个误人子弟系列实在就是炒冷饭。

我不知道会写若干篇，横竖写着再说，出题目了请包涵，毕竟是误人子弟嘛，有题目请批评，我好修正。

先从简朴的最先。

来吃狗。

<input type="button" value="width">
<input type="button" value="height">
<input type="button" value="background">
<input type="button" value="hidden">
<input type="button" value="reset">
<div id="div"></div>

比方如今有这些dom，我们经由过程这个button的点击去修正div的一些属性。怎么做呢？

var attributes=['width','height','background','display','display'];
var values=['200px','200px','red','none','block'];
var div=document.getElementById('div');
var btns=document.getElementsByTagName('input');
for(var i=0,len=btns.length;i<len;i++){
  btns[i].index=i;
  btns[i].onclick=function(){
    div.style.cssText="";
    div.style[attributes[this.index]]=values[this.index];
  }
}

为了轻易，我们把要改的一些属性写出数组，然后遍历那几个按钮，加上索引，然后绑定点击事宜，修正款式，简朴的来讲就是相似div.style['width'] = '200px'的体式格局修正。

demo

讲讲切换css款式，就是传说中的换肤功用的基本。

页面中引入css款式的平常都是用<link rel="stylesheet" href="a.css">，所以我们经由过程修正这个href来转变页面中的外链款式。

<span title="red">red</span>
<span title="blue">blue</span>
<div id="div">this is a div</div>

var btns=document.getElementsByTagName('span');
var link=document.getElementsByTagName('link');
for(var i=0,len=btns.length;i<len;i++){
  btns[i].onclick=function(){
    for(var j in btns)
    btns[j].className="";
    this.className="current";
    link[0].setAttribute("href",this.title+".css");
  }
}

如许我们能够切换red.css和blue.css来切换皮肤。

demo

js函数中有个主要的东西，叫arguments数组，举个例子

<input type="text" value="input1">
<input type="text" value="input2">
<button>alert</button>

window.onload=function(){
    var inputs=document.getElementsByTagName('input');
    var button=document.getElementsByTagName('button')[0];
    button.onclick=function(){
        fun(inputs[0].value,inputs[1].value);
    }
}
function fun(){
    for(var i in arguments){
        alert(arguments[i]);
    }
}

主如果这个fun函数把一系列参数弹窗。

demo

夜深了，先放这么三段吧。

未完成的demo本体