(020)javascript_dom_appendChild 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title>DOM</title>
 6     <script type="text/javascript">
 7 
 8         window.onload = function() {
 9 
10             var btnNode = document.getElementById("mybtn");
11             var ulNode = document.getElementById("myul");
12             var textNode = document.getElementById("mytext");
13 
14             btnNode.onclick = function() {
15 
16                 var liNode = document.createElement("li");
17 
18                 liNode.innerHTML = textNode.value;
19 
20                 ulNode.appendChild(liNode);
21             };
22         };
23         
24     </script>
25 </head>
26 
27 <body>
28     <input id="mybtn" type="button" value="创建li"/> 
29     <input id="mytext" type="text"/>
30     <ul id="myul">
31         <li>节点1</li>
32     </ul>
33 </body>
34 </html>

 

posted @ 2014-02-06 10:04  雪中飞雁  阅读(132)  评论(0)  编辑  收藏  举报