insertAdjacentHTML
/**
* 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的更多相关文章
- (转)DOM appendHTML实现及insertAdjacentHTML
appenChild() 原文转自 JS中有很多基本DOM方法,例如createElement, parentNode等,其中,appendChild方法是相当地常用与熟知,可谓是DOM节点方法中的& ...
- 使用insertBefore实现insertAdjacentHTML()
Element.insertAdjacentHTML()方法由IE引入,并在HTML5中标准化,它将任意的HTML标记字符串插入到指定的元素“相邻”的位置. insertAdjacentHTML()有 ...
- innerHTML,outerHTML,innerText,outerText区别以及insertAdjacentHTML()方法
在需要给文档插入大量的新的HTML标记的情况下,通过多次DOM操作先创建节点再指定它们之间的关系会非常麻烦而且效率不高,相对而言插入标记的方法会更加简单,速度也更快. 插入标记中有这四个属性inner ...
- insertAdjacentHTML方法示例
添加HTML内容与文本内容以前用的是innerHTML与innerText方法,最近发现还有insertAdjacentHTML和insertAdjacentText方法,这两个方法更灵活,可以在指定 ...
- insertAdjacentHTML和insertAdjacentText方法
IE的DHTML对象提供了四个可读写的属性来动态操作页面元素的内容:innerText, outerText, innerHTML, outerHTML. 需注意两点: 1. 其中innerText, ...
- Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null
在开发Ext 项目中如果遇到 Uncaught TypeError: Cannot read property 'insertAdjacentHTML' of null 这个错误,检查下renderT ...
- JS代码片段:appendHTML 和 insertAdjacentHTML
function appendHTML(container,html,position){ position =position || 'after'; var objE = document.cre ...
- [译]JavaScript insertAdjacentHTML
原文地址:http://davidwalsh.name/insertadjacenthtml-beforeend 该死的DOM慢的很.随着我们的网站动态交互和Ajax操作越来越多,我们需要寻找一种高性 ...
- 插入标记 方法 insertAdjacentHTML
html5新增的插入标记方法,insertAdjacentHTML() 可以接受2个参数 插入位置和要插入的 HTML 文本.第一个参数必须是下列值之一: "beforebegin" ...
随机推荐
- thinkphp 调用系统的方法
在需要调用的脚本 加载 load('filename');//filename为文件名
- linux ps命令介绍
来源<鸟哥的linux私房菜> ps:将某个时间点的程序运作情况撷取下来 [root@linux ~]# ps aux [root@linux ~]# ps -lA [root@linux ...
- configure错误列表供参考
另外附一些常见的configure错误列表供参考: configure: error: No curses/termcap library found网上有的说法是:--with-named-curs ...
- Qml一些技巧
1.从ListView中获取当前选中项 myList.currentItem.children[0].text 可以获取ListView的选择项的一个个元素.注意children的使用.
- CentOS 7.2 安装教程
1.CentOS 7.2 下载 下载地址: http://www.centoscn.com/CentosSoft/iso/2016/0601/7341.html 下载:CentOS-7-x86_64- ...
- POJ 3468 区间更新,区间求和(经典)
A Simple Problem with Integers Time Limit: 5000MS Memory Limit: 131072K Total Submissions: 72265 ...
- C++之函数fgetc和fputc、fgets和fputs、fread和fwrite、fscanf和fprintf用法小结
#include <iostream> #include <cstdio> #include <cstdlib> using namespace std; int ...
- Servlet初识
1.servlet的生命周期 servlet生命周期中的三大重要时刻 servlet从不存在状态迁移到初始化状态(能够为客户提供服务),首先是从构造函数开始,但是构造函数只是使其成为一个对象,而不是一 ...
- 在同一个页面中加载多个不同的jQuery版本
<!-- 从谷歌服务器加载jQuery最新版本--> <script type="text/javascript" src="http://ajax.g ...
- 启动BPM的5个步骤
在大部分业务中,我们通常认为:一个主要的业务流程管理项目从设计时间开始会比较好.我们知道很多方式来提高效率,增加生产力以及简化我们员工的工 作 - 这正是业务流程管理所做的.不幸的是,不管我们意图多好 ...