Javascript教程:控制DIV属性

Javascript教程：控制DIV属性

    点击按钮改变DIV属性，通过点击不同的按钮设置DIV的样式。
    代码如下：

<script type="text/javascript">
    var oBox = document.getElementById('box');
    var oDiv = document.getElementById('div1');
    var aInput = document.getElementsByTagName('input');
    var aAttr = ['width', 'height', 'backgroundColor', 'display', 'display'];
    var aValue = ['200px', '200px', 'red', 'none', 'block'];
    for(var len=aInput.length,i=0;i<len;i++){
        aInput[i].index = i;  //索引
        aInput[i].onclick = function(){
            //重置按钮,cssText清空DIV属性
            if(this.index == aInput.length - 1)oDiv.style.cssText = "";
            //设置DIV属性
            property(oDiv, aAttr[this.index], aValue[this.index]);
        };
    }
    //控制DIV属性
    function property(obj, attr, value){
        obj.style[attr] = value;
    }
</script>