日期:2014-05-16 浏览次数:20346 次
<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>