手机浏览 RSS 2.0 订阅 膘叔的简单人生 , 腾讯云RDS购买 | 超便宜Qcloud , 注册 | 登陆

测试insertAdjacentElement

首页 > Javascript >

和insertAdjacentHtml等方法类似,只是一个插对象,一个插具体内容,其实都一样啦。
介绍:
语法:
oElement = object . insertAdjacentElement ( sWhere , oElement )
参数:
oElement : 必选项。对象(Element)。要插入到 object 邻近的对象。
sWhere : 必选项。字符串(String)。beforeBegin | afterBegin | beforeEnd | afterEnd beforeBegin : 将 oElement 插到 object 的开始标签之前。
afterBegin : 将 oElement 插到 object 的开始标签之后。但是在 object 的所有原有内容之前。
beforeEnd : 将 oElement 插到 object 的结束标签之前。但是在 object 的所有原有内容之后。
afterEnd : 将 oElement 插到 object 的结束标签之后。
返回值:
oElement : 对象(Element)。返回插入的对象的引用。
说明:
将 oElement 依据 object 定位插入文档结构。
当文档正在载入时,不可以尝试此方法。必须在 onload 事件触发以后。
假如你尝试插入一个已经在文档结构中存在定位的对象,该对象将被移动到你指定的插入位置,而不会有新对象被创建。 【这个功能好啊。不会创建出同名元素等】
测试代码:

XML/HTML代码
  1. <script>  
  2.     var i_nowheight = 250;  
  3.     function rdl_doApply(e) {  
  4.         with (document.all("oSelect1")) var sParam1 = options[selectedIndex].value;  
  5.         with (document.all("oSelect2")) var sParam2 = options[selectedIndex].value;  
  6.         var oNewNode = document.createElement(sParam1);  
  7.         oList.insertAdjacentElement(sParam2, oNewNode);  
  8.         oNewNode.innerText = sParam2  
  9.         i_nowheight += 30;  
  10.         window.resizeTo(360, i_nowheight);  
  11.     }  
  12. </script>  
  13. <div id=oCode>  
  14.     <ul id=oList>  
  15.         <li>列表项目1  
  16.         <li>列表项目2  
  17.     </ul>  
  18. </div>  
  19. <table height=56>  
  20.     <tr>  
  21.         <td><select style="width:100px;" id=oSelect1>  
  22.             <option value="button" selected>button</option>  
  23.             <option value="b">b</option>  
  24.         </select></td>  
  25.         <td><select style="width:100px;" id=oSelect2>  
  26.             <option value="beforeBegin" selected>beforeBegin</option>  
  27.             <option value="afterBegin">afterBegin</option>  
  28.             <option value="beforeEnd">beforeEnd</option>  
  29.             <option value="afterEnd">afterEnd</option>  
  30.         </select></td>  
  31.         <td><input type=button value=" 插入 " onclick="rdl_doApply()"></td>  
  32.     </tr>  
  33. </table>  

 




本站采用创作共享版权协议, 要求署名、非商业和保持一致. 本站欢迎任何非商业应用的转载, 但须注明出自"膘叔", 保留原始链接, 此外还必须标注原文标题和链接.

« 上一篇 | 下一篇 »

发表评论

评论内容 (必填):