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. rpm重装python和yum

    前些天升级的python, yum就不能用了, 提示 "No module named yum", 然后搜索了一下, 说要重装python和yum, 也没多想, 就按照那些教程去做 ...

  2. Java Collection.Set

    package 集合; /** * Set不包含重复元素 存储顺序和取出数据不一样 * * HashSet:它不保证set的迭代顺序,特别是它不保证该顺序恒久不变 * 底层是哈希表结构的 * Link ...

  3. jquery点滴总结

    1.empty().remove().detach() empty():只移除了 指定元素中的所有子节点,而留下 了<p></p>,仍保留其在dom中所占的位置. remove ...

  4. c#-cs-bs-正则表达式

    C/S     B/S Cs结构:     C/S(Client/Server)客户机/服务器 BS机构:     B/S(Browser/Server)浏览器/服务器       à(未来发展方向) ...

  5. setInterval()设置页面5,4,3,2,1秒后跳转

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. Windows10 iis10 arr webfarm

    win10安装arr提示安装失败,但是安装说明中提升iis7及以上版本,iis10却安装失败,坑爹!安装方法: 1.HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSe ...

  7. python 爬虫初试

    python3.5  抓网易新闻的排行榜上的新闻,主要用自带的request模块和lxml import re from urllib import request from lxml import ...

  8. 类的方法练习——定义MySQL类

    要求: 1.对象有id.host.port三个属性 2.定义工具create_id,在实例化时为每个对象随机生成id,保证id唯一 3.提供两种实例化方式,方式一:用户传入host和port 方式二: ...

  9. CRM——讲师与学生

    一.课程记录和学习记录 1.初始化 course_record, study_record.2.学习记录3.录入成绩4.显示成绩 ajax 查询 柱状图展示成绩 highcharts 5.上传作业(o ...

  10. 软件项目技术点(2)——Canvas之获取Canvas当前坐标系矩阵

    AxeSlide软件项目梳理   canvas绘图系列知识点整理 前言 在我的另一篇博文 Canvas坐标系转换 中,我们知道了所有的平移缩放旋转操作都会影响到画布坐标系.那在我们对画布进行了一系列操 ...