insertAdjacentHTML:insertAdjacentHTML() 将指定的文本解析为HTML或XML，并将结果节点插入到DOM树中的指定位置。它不会重新解析它正在使用的元素，因此它不会破坏元素内的现有元素。这避免了额外的序列化步骤，使其比直接innerHTML操作更快。

语法：element.insertAdjacentHTML(position, text)；

beforebegin 元素自身的前边

afterbegin 插入元素内部第一个子节点的前边

beforeend 插入元素内部最后一个子节点之后

afterend 元素自身的后边

innerHTML  语法：element.innerHTML

insertAdjacentHTML与innerHTML的更多相关文章

  1. 全栈JavaScript之路（十九）HTML5 插入 html标记 （ 一 ）innerHTML 与outerHTML

    在须要给文档插入大量的html 标记下.通过DOM操作非常麻烦,你不仅要创建一系列的节点,并且还要小心地依照顺序把它们接结起来. 利用html 标签 插入技术,能够直接插入html代码字符串,简单.高 ...

  2. 深入理解DOM节点操作

    × 目录 [1]创建节点 [2]插入节点 [3]移除节点[4]替换节点[5]复制节点 前面的话 一般地,提起操作会想到“增删改查”这四个字,而DOM节点操作也类似地对应于此,接下来将详细介绍DOM的节 ...

  3. js中几种动态创建元素并设置文本内容的比较，及性能测试。

    内容 1 appendChild (都兼容) 2.insertAdjacentHTML (都兼容) 3.innerHTML (都兼容) 4.createDocumentFragment (都兼容) 动 ...

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

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

  5. (转)DOM appendHTML实现及insertAdjacentHTML

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

  6. 使用insertBefore实现insertAdjacentHTML()

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

  7. insertAdjacentHTML方法示例

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

  8. insertAdjacentHTML和insertAdjacentText方法

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

  9. JS代码片段：appendHTML 和 insertAdjacentHTML

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

随机推荐

  1. HDU 5318——The Goddess Of The Moon——————【矩阵快速幂】

    The Goddess Of The Moon Time Limit: 6000/3000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/ ...

  2. [转]Debugging into .NET Core源代码的两种方式

    本文转自:http://www.cnblogs.com/maxzhang1985/p/6015719.html 阅读目录 一.前言 二.符号服务器 三.项目中添加ASP.NET Core源代码 四.写 ...

  3. embedded tomcat运行java web，Unable to compile class for JSP

    环境 eclipse:4.5.2 jre:1.8 java project compiler:1.8 embedded tomcat:7.0.32 可以正常启动,但是访问时,会报错. HTTP Sta ...

  4. 数组和矩阵（1）——Find the Duplicate Number

    Given an array nums containing n + 1 integers where each integer is between 1 and n (inclusive), pro ...

  5. lua load

    load (chunk [, chunkname [, mode [, env]]]) 加载一个代码块. 如果 chunk 是一个字符串,代码块指这个字符串. 如果 chunk 是一个函数, load ...

  6. Celery-------项目目录

    在实际应用中Celery的目录是有规则的 要满足这样的条件才可以 目录Celery_task这个名字可以随意,但是这个目录下一定要有一个celery.py这个文件 from celery import ...

  7. 设置cssrem，设置emmet

    1.文件->首选项->设置 2.搜索cssrem-> 点击设置:"cssrem.rootFontSize": 16, 4.emmet

  8. 移动Web布局

    移动Web开发之移动页面布局 前言 本文针对手机设备设计的页面,并非兼容全设备的响应式布局,常见的MobileWeb页面如H5页面.手机页面.WAP页.webview页面等等.在不同尺寸的手机设备上, ...

  9. 【Linux】TFTP & NFS 服务器配置

    Why?--交叉开发 一.交叉开发模型 宿主机(PC)------ 网络.串口.USB.JTAG ------ 目标机(ARM系统) PC机作为TFTP & NFS 服务器,目标机从网络下载软 ...

  10. wxpython 对话框

    . 消息对话框(wx.MessageDialog) 消息对话框 与用户通信最基本的机制是wx.MessageDialog,它是一个简单的提示框. wx.MessageDialog可用作一个简单的OK框 ...