重回JS—简单选择器（练习）

摘要：
1、遮罩
两个条件：背景色（黑色）+透明度
如：background:#000;opacity:0.3;
注意：遮罩元素的定位
2、去除button标签的默认样式
border:none；即可
3、line-height:2 和 line-height:2px 的区别
举例说明：
.span2{font-size:16px ; line-height:2 ; }意思是行高为字体大小16px的倍
.span2{font-size:16px ; line-height:2px ; }意思是无论字体大小多少，行高固定为2px
4、在事件中获取某数组的元素值（重要！）

for(var i=0;i<aLi.length;i++){
    aLi[i].index = i;
    aLi[i].onclick=function(){  
        var n = this.index;
        oDiv1.style.background=arr_color[n];
    }
}

PS:在aLi[i].onclick事件中获取arr_color数组中的元素,下标一定不是变量i !!
而是先在大的for循环里添加aLi[i].index = i;让i等价变换aLi[i].index, 然后在onclick事件中添加var n = this.index;这样,数组中的变量i就被等价替换成n,才是正确的,一定要注意!
5、在html里写的代码是按顺序执行的，也就是说，后面的会覆盖前面的，要注意书写顺序，得到正确的显示!