/**
* insertAdjacentHTML
* 支持 insertAdjacentHTML()方法的浏览器有 IE、Firefox 8+、Safari、Opera 和 Chrome
*/
var element = document.querySelector('#box2')
//作为前一个同辈元素插入
element.insertAdjacentHTML("beforebegin", "<p>Hello world!</p>")
//作为后一个同辈元素插入
element.insertAdjacentHTML("afterend", "<p>Hello world!</p>")
//作为第一个子元素插入
element.insertAdjacentHTML("afterbegin", "<p>Hello world!</p>")
//作为最后一个子元素插入
element.insertAdjacentHTML("beforeend", "<p>Hello world!</p>")

insertAdjacentHTML的更多相关文章

  1. (转)DOM appendHTML实现及insertAdjacentHTML

    appenChild() 原文转自 JS中有很多基本DOM方法,例如createElement, parentNode等,其中,appendChild方法是相当地常用与熟知,可谓是DOM节点方法中的& ...

  2. 使用insertBefore实现insertAdjacentHTML()

    Element.insertAdjacentHTML()方法由IE引入,并在HTML5中标准化,它将任意的HTML标记字符串插入到指定的元素“相邻”的位置. insertAdjacentHTML()有 ...

  3. innerHTML,outerHTML,innerText,outerText区别以及insertAdjacentHTML()方法

    在需要给文档插入大量的新的HTML标记的情况下,通过多次DOM操作先创建节点再指定它们之间的关系会非常麻烦而且效率不高,相对而言插入标记的方法会更加简单,速度也更快. 插入标记中有这四个属性inner ...

  4. insertAdjacentHTML方法示例

    添加HTML内容与文本内容以前用的是innerHTML与innerText方法,最近发现还有insertAdjacentHTML和insertAdjacentText方法,这两个方法更灵活,可以在指定 ...

  5. insertAdjacentHTML和insertAdjacentText方法

    IE的DHTML对象提供了四个可读写的属性来动态操作页面元素的内容:innerText, outerText, innerHTML, outerHTML. 需注意两点: 1. 其中innerText, ...

  6. Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null

    在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...

  7. JS代码片段:appendHTML 和 insertAdjacentHTML

    function appendHTML(container,html,position){ position =position || 'after'; var objE = document.cre ...

  8. [译]JavaScript insertAdjacentHTML

    原文地址:http://davidwalsh.name/insertadjacenthtml-beforeend 该死的DOM慢的很.随着我们的网站动态交互和Ajax操作越来越多,我们需要寻找一种高性 ...

  9. 插入标记 方法 insertAdjacentHTML

    html5新增的插入标记方法,insertAdjacentHTML() 可以接受2个参数 插入位置和要插入的 HTML 文本.第一个参数必须是下列值之一: "beforebegin" ...

随机推荐

  1. 使用FIDDER 抓包构建请求

    FIDDER 是一个抓包利器,可以抓去浏览器的http请求. 工作原理是: FIDDER 作为代理. 1.在启动fidder时他自动启动服务监听8888端口.     2.启动FIDDER它会自动修改 ...

  2. js基础之面向对象

    一.基本概念 Array类 ————> 不具备实际的功能,只能用来构造对象 arr对象  ————> 有实际的功能,被类给构造出来 如:var arr=new Array(); proto ...

  3. js用正则表达式控制价格输入

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  4. encodeURI

    encodeURI("http://www.cnblogs.com/season-huang/some other thing"); //整个URL进行编码"http:/ ...

  5. EntLib Unity父类的依赖注入问题

    Unity的注入有3种方式:构造函数.[Dependency]属性.[InjectionMethod]方法.这3种方式涉及到的interface或class都会去Registrations里找,找不到 ...

  6. 在oracle中使用Trigger

    1.初始目标 在对表h1插入一条数据时,同时插入一条重复的数据(只有主键不同) 2.在PL/SQL里New一个Trigger或者手动敲入代码 先说明一下,表h1包括4列ID.C1.C2.C3 crea ...

  7. 数列F[19] + F[13]的值

    已知数列如下:F[1]=1, F[2]=1, F[3]=5,......,F[n] =F[n-1] + 2*F[n-2],求F[19] + F[13]? #include <stdio.h> ...

  8. [开发笔记]-获取歌曲ID3信息

    ID3介绍: ID3,一般是位于一个mp3文件的开头或末尾的若干字节内,附加了关于该mp3的歌手,标题,专辑名称,年代,风格等信息,该信息就被称为ID3信息,ID3信息分为两个版本,v1和v2版. 获 ...

  9. TClientDataSet 设计期 多次New 字段问题

    第一次New几个字段后,右键菜单CreateDataSet 后来需要再New几个字段. 右键菜单,先 ClearData(不这样,会报 打开的数据集不能执行 这个New字段的操作),然后在 字段编辑器 ...

  10. outlook新邮件到达提醒设置以及outlook最小化到托盘设置

    有些邮件是需要马上处理的,因此希望能在收到邮件之后马上就知道,但是有不希望频繁的去检查有没有.outlook可以帮我们轻松做到新邮件到达提醒. 一 .设置outlook新邮件到达提醒:选项->电 ...