用javascript来添加元素的zindex属性

今天写静态，要用到javascript来做个遮罩效果，要个自己的遮罩层做添加个z-index的属性

起初的javascript代码是这样写的：

View Code

 1 function show(strId) {
 2 document.getElementById(strId).style.display = 'block';
 3 var sWidth, sHeight;
 4 sWidth = parent.document.body.clientWidth;
 5 sHeight = parent.document.body.clientHeight;
 6 var bgObj = parent.document.createElement("div");
 7 bgObj.setAttribute('id', 'bgDiv');
 8 bgObj.style.z-index = "300";
 9 bgObj.style.position = "absolute";
10 bgObj.style.top = "0";
11 bgObj.style.left = "auto";
12 bgObj.style.right = "auto";
13 bgObj.style.background = "#777";
14 bgObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=3, opacity=25,finishOpacity=75";
15 bgObj.style.opacity = "0.6";
16 bgObj.style.width = sWidth + "px";
17 bgObj.style.height = sHeight + "px";
18 document.body.appendChild(bgObj);
19 }

发现效果实现不了，查找了有关资料后，知道应将里面的 bgObj.style.z-index = "300" 改为bgObj.style.zIndex = "300" 即可