标签:style http color io java ar for art div
<!DOCTYPE html> <!-- lang: html --> <html> <!-- lang: html --> <head> <!-- lang: html --> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!-- lang: html --> <!-- lang: html --> </head> <!-- lang: html --> <body > <!-- lang: html --> <form> <!-- lang: html --> <!-- lang: html --> <input type="button" value="开始计时!" > <!-- lang: html --> <input type="text" id="txt"> <!-- lang: html --> </form> <!-- lang: html --> <script type="text/javascript"> <!-- lang: html --> // debugger; <!-- lang: html --> // window.onload = function (){ <!-- lang: html --> // if(document.readyState=="complete"){ <!-- lang: html --> // function funTime(){ <!-- lang: html --> var t; <!-- lang: html --> var i=0; <!-- lang: html --> function timedCount() <!-- lang: html --> { <!-- lang: html --> document.getElementById(‘txt‘).value=i; <!-- lang: html --> i++; <!-- lang: html --> t=setTimeout("timedCount()",100); <!-- lang: html --> }; <!-- lang: html --> <!-- lang: html --> function stopCount(){ <!-- lang: html --> clearTimeout(t); <!-- lang: html --> }; <!-- lang: html --> <!-- lang: html --> /* var a = document.getElementById("test"); <!-- lang: html --> a.onmouseover=function(){timedCount()};*/ <!-- lang: html --> <!-- lang: html --> var node = document.createElement("div"); <!-- lang: html --> node.setAttribute("class","test"); <!-- lang: html --> node.setAttribute("style","background-color:#00ff00;height:400px;width:400px"); <!-- lang: html --> <!-- lang: html --> var node1 = document.createElement("div"); <!-- lang: html --> node1.setAttribute("class","test"); <!-- lang: html --> node1.setAttribute("style","background-color:#ff0000;height:400px;width:400px"); <!-- lang: html --> <!-- lang: html --> document.body.appendChild(node); <!-- lang: html --> document.body.appendChild(node1); <!-- lang: html --> <!-- lang: html --> var node2 = document.createElement("div"); <!-- lang: html --> var attr = document.createAttribute("style"); <!-- lang: html --> attr.value = "background-color:#0000ff;height:400px;width:400px"; <!-- lang: html --> node2.setAttributeNode(attr); <!-- lang: html --> <!-- lang: html --> <!-- lang: html --> document.body.appendChild(node2); <!-- lang: html --> <!-- lang: html --> for (var j=0; j<2; j++){ <!-- lang: html --> document.getElementsByClassName("test")[j].onmouseover=function(){timedCount()}; <!-- lang: html --> document.getElementsByClassName("test")[j].onmouseout=function(){stopCount()}; <!-- lang: html --> } <!-- lang: html --> // } <!-- lang: html --> <!-- lang: html --> </script> <!-- lang: html --> </body> <!-- lang: html --> </html>
这里面有两种创建属性节点的方式,后面会学习创建文本节点。
标签:style http color io java ar for art div
原文地址:http://my.oschina.net/u/933915/blog/310512