读书人

用JS增加页面标签跟属性

发布时间: 2013-11-09 17:06:34 作者: rapoo

用JS增加页面标签和属性

<html>   <head>       <title>innerHtml</title>       <meta http-equiv="content-type" content="text/html; charset=gb2312" />   </head>   <script type="text/javascript" src="dojo-release-1.1.1/dojo/dojo.js"></script>   <script type="text/javascript" language="javascript">       function change_content(){           var str="chang content!<br>";           var temp=document.getElementById("old_div");           temp.innerHTML=str;           var new_span=document.createElement("span");           new_span.setAttribute("id","new_span");           new_span.setAttribute("class","color1");           //new_span.id="new_span";           var new_text=document.createTextNode("This is a new node!");           new_span.appendChild(new_text);           temp.appendChild(new_span);                                         temp = document.getElementById("add_content");           temp.setAttribute("value","改变颜色");           temp.setAttribute("onclick","change_color()");       }              function change_color(){           var temp = document.getElementById("new_span");           temp.setAttribute("class","color2");       }   </script>   <style>       .color1{           background-color:yellow;       }       .color2{           background-color:red;       }   </style>   <body>       <div id="old_div">No content!</div>       <input type="button" id="add_content" onclick="change_content()" value="内容"/><br/>       <input type="button" value="换色" onclick="change_color();"/>   </body></html> 

读书人网 >JavaScript

热点推荐