注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

哈哈~

八零后尾巴上的小青年^_^……

 
 
 

日志

 
 

引用 appendChild,removeChild,insertBefore用法的一些例子  

2010-09-18 16:05:22|  分类: 技术累积 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

 

引用

cooldhappendChild,removeChild,insertBefore用法的一些例子

DEMO1:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>

<BODY>
   <script   language="javascript">  
  var   n=1;  

 function   addInput()  
  {  
 var br = document.createElement("BR");
   document.form1.appendChild(br);
    for(i=0;i<5;i++){
      var   input   =   document.createElement("INPUT");  
      input.type="text";  
      input.name="whatever"+n++;  
  document.form1.appendChild(input);
 }
      
  }

  </script>  
  <form   name="form1">  
   <input   type="button"   value="add"   onclick="addInput()">  
  </form>  
  hello   world
  <p>
-------------------------------------------------------------------------------------
  </p>
  <select   id=test   size=4   style="width:50">  
  <option>aaa</option>  
  <option>bbb</option>  
  <option>ccc</option>  
  </select>  
  <button   onclick="test.removeChild(test.firstChild)">test1</button>//此种用法在IE7存在BUG
  <button   onclick="test[0]=null">test2</button>  
  <br>

<select   id=test1   size=5   style="width:50px"></select>  
  <button   onclick="test1[test1.length]=new   Option('test1','test1');">test1</button>  
  <button   onclick="test1.insertBefore(new   Option('test2','test2'));">test2</button>  
  <button   onclick="test1.appendChild(new   Option('test3','test3'));">test3</button>

 </BODY>
</HTML>

 

DEMO2:

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>

 <BODY>
  <select   id=test   size=5   style="width:50px"></select>  
   
  <button   onclick='test[test.length]=new   Option("1");'>add1</button>  
  <button   onclick='test.insertBefore(document.createElement("option")).innerText="2";'>add2</button>  
  <button   onclick='test.appendChild(document.createElement("option")).innerText="3";'>add3</button>  
  <button   onclick="alert(test.outerHTML)">view</button>  
   
  <button   onclick="test.removeChild(test.children[0])">del1</button>  
  <button   onclick="test.firstChild.removeNode()">del2</button>  
  <button   onclick="test[0]=null">del3</button> 
 </BODY>
</HTML>


 

  评论这张
 
阅读(65)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017