修改节点的内容除了常用的innerHTML和innerText之外,还有insertAdjacentHTML和insertAdjacentText方法,可以在指定的地方插入内容。insertAdjacentText方法与insertAdjacentHTML方法类似,只不过是插入纯文本,参数相同。

语法:

object.insertAdjacentHTML(where,html)

参数说明:

1.where:包括beforeBegin,beforeEnd,afterBegin,afterEnd

beforeBegin: 插入到开始标签的前面。

beforeEnd:插入到结束标签的前面。

afterBegin:插入到开始标签的后面。

afterEnd:插入到结束标签的后面。

2.html:需插入的html内容

需注意的是:

1.这两个方法必须等文档加载好后才能执行,否则会出错。

2.insertAdjacentText只能插入普通文本,insertAdjacentHTML插入html代码。

3.使用insertAdjacentHTML方法插入script脚本文件时,必须在script元素上定义defer属性。

4.使用insertAdjacentHTML方法插入html代码后,页面上的元素集合将发生变化。

5.insertAdjacentHTML方法不适用于单个的空的元素标签(如img,input等)。

说明:

JS insertAdajcentHTML 方法简介的更多相关文章

  1. Node.js 教程 01 - 简介、安装及配置

    系列目录: Node.js 教程 01 - 简介.安装及配置 Node.js 教程 02 - 经典的Hello World Node.js 教程 03 - 创建HTTP服务器 Node.js 教程 0 ...

  2. jQuery的AJAX方法简介及与其他文件$符号冲突的解决办法

    一.重要的jQuery AJAX方法简介 $.load(url) 从服务器载入数据 $.get(url,callback) 从服务器请求数据,并执行回调函数 $.post(url,data,callb ...

  3. 还在手动给css加前缀?no!几种自动处理css前缀的方法简介

    原文首发于个人博客:还在手动给css加前缀?no!几种自动处理css前缀的方法简介 我们知道在写css的时候由于要兼容不同厂商浏览器,一些比较新的属性需要给它们添加厂商前缀来兼容.移动端还好,基本只要 ...

  4. 【转】安装Vue.js的方法

    安装vue.js的方法   一.简介 Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量 ...

  5. D3.js 之 d3-shap 简介(转)

    [转] D3.js 之 d3-shap 简介 译者注 原文: 来自 D3.js 作者 Mike Bostock 的 Introducing d3-shape 译者: ssthouse 联系译者: 邮箱 ...

  6. js调用php和php调用js的方法举例

    js调用php和php调用js的方法举例1 JS方式调用PHP文件并取得php中的值 举一个简单的例子来说明: 如在页面a.html中用下面这句调用: <script type="te ...

  7. 网络神器Greasemonkey(油猴子)使用方法简介+脚本分享【转载】

    推荐下,觉得这个方法有用, 今天艾薇百科来介绍一下功能强大的Greasemonkey,俗称"油猴子",Greasemonkey可以自由定制网页,实现你想要的各种功能.堪称" ...

  8. Redis Cluster搭建方法简介22211111

    Redis Cluster搭建方法简介 (2013-05-29 17:08:57) 转载▼       Redis Cluster即Redis的分布式版本,将是Redis继支持Lua脚本之后的又一重磅 ...

  9. Monte Carlo方法简介(转载)

    Monte Carlo方法简介(转载)       今天向大家介绍一下我现在主要做的这个东东. Monte Carlo方法又称为随机抽样技巧或统计实验方法,属于计算数学的一个分支,它是在上世纪四十年代 ...

随机推荐

  1. mysql 存储过程--- 创建,调用,删除

    DELIMITER //CREATE PROCEDURE p_addscore(nums INT,OUT retrows INT)BEGINDECLARE i INT DEFAULT 0;add_lo ...

  2. BinaryWriter

    c#里的文件操作 fileInfo dir的一大堆属性不用说 地球人都知道(什么fileName,create() delete()) ,文件系统的概念很好理解的 文件读写也好理解(硬盘到内存 然后再 ...

  3. 往Android SDCard中读写入数据

    一.用Environment (写) 1.API获取sdcard的路径 File path=Environment.getExternalStorageDirectory(); path=new Fi ...

  4. Tkinter教程之Listbox篇

    本文转载自:http://blog.csdn.net/jcodeer/article/details/1811310 #Tkinter教程之Listbox篇#Listbox为列表框控件,它可以包含一个 ...

  5. 基于Qt的第三方库和控件

    ====================== 基于Qt的第三方库和控件 ======================     libQxt --------   http://dev.libqxt.o ...

  6. java 多线程Callable和Runable执行顺序问题详解

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt125 毫无疑问 Runnable会进行异步执行,此处不多说,主要说明Call ...

  7. 毕向东—Java基础知识总结(超级经典)

    Java基础知识总结(超级经典) 写代码: 1,明确需求.我要做什么? 2,分析思路.我要怎么做?1,2,3. 3,确定步骤.每一个思路部分用到哪些语句,方法,和对象. 4,代码实现.用具体的java ...

  8. oracle存储过程和存储函数&amp;触发器

    oracle存储过程和存储函数 指存储在数据库中供所有用户程序调用的子程序叫存储过程,存储函数 存储过程和存储函数的相同点:完成特定功能的程序 存储过程和存储函数的区别:是否用return语句返回值 ...

  9. Mysql 索引 事物

    索引 针对庞大数据 加速查询 缺点 占用空间 分类: 普通索引: 通过 index 创建 唯一索引: 就是 unique key 主键索引: 就是 primary key 联合索引(多列)" ...

  10. Python带你轻松进行网页爬虫

    前不久DotNet开源大本营通过为.NET程序员演示如何在.NET下使用C#+HtmlAgilityPack+XPath进行网页数据的抓取,从而为我们展示了HtmlAgilitypack利器的优点和使 ...