中所有的p添加onclick事件和表格隔行色以及checkbox的
[align=left]
display和bisibility
//当visibility被设置为"hidden"的时候,元素虽然被隐藏了,但它仍然占据它原来所在的位置。 document.getElementById("id").style.visibility="visible"; document.getElementById("id").style.visibility="hidden"; //display被设置为"none"的时候,元素被隐藏了,也它原来所在的位置空出 //display被设置为"block"的时候 和div一使用"" 而inline就相於一span document.getElementById("id").style.display="block"; document.getElementById("id").style.display="inline"; document.getElementById("id").style.display="none";
中所有的p添加onclick事件
<p>1</p> <p>2</p> <p>3</p>
<script type="text/javascript"> var pitems = document.getElementsByTagName("p");//Dom方式取所有p元素 for (var i = 0; i < pitems.length; i++) { pitems[i].onclick = function() { alert(this.innerHTML); } }</script>
特定的表格隔行色
<table id="tb"> <tbody> <tr> <td>第一行第一列</td> <td>第一行第二列</td> </tr> <tr> <td>第二行第一列</td> <td>第二行第二列</td> </tr> <tr> <td>第三行第一列</td> <td>第三行第二列</td> </tr> <tr> <td>第四行第一列</td> <td>第四行第二列</td> </tr> <tr> <td>第五行第一列</td> <td>第五行第二列</td> </tr> <tr> <td>第六行第一列</td> <td>第六行第二列</td> </tr> </tbody></table>
<script type="text/javascript"> var item = document.getElementById("tb");//取Idtb的元素 var tbody = item.getElementsByTagName("tbody")[0];//取表格的第一tboby元素 var trs = tbody.getElementsByTagName("tr");//取tboby元素下的所有tr元素 for (var i = 0; i < trs.length; i++) { if (i % 2 == 0) { trs[i].style.backgroundColor = "#888"; } }</script>
取checkbox中的把值push到Array中去
<input type="checkbox" value="1" name="check" checked="checked"/><input type="checkbox" value="2" name="check"/><input type="checkbox" value="3" name="check" checked="checked"/><input type="checkbox" value="4" name="check"/><input type="button" value="中的" id="btnchk">
<script type="text/javascript"> var btnchk = document.getElementById("btnchk");//取idbtnchk的button元素 btnchk.onclick = function() { var chkarr = new Array();//建一 var chkitems = document.getElementsByName("check");//取name性值'check'的一checkbox元素 //循 for(var i=0;i<chkitems.length;i++) { //判是否被中 if(chkitems[i].checked){ chkarr.push(chkitems[i].value);//中的checkbox的值push到中去 } } alert("中的:"+chkarr.length); }
[/align]