修改节点的内容除了常用的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. git报错 error: cannot stat ‘file’: Permission denied

    切换分支时报错: error: cannot stat ‘file’: Permission denied 解决方法:退出编辑器.浏览器.资源管理器等,然后再切换就可以了.

  2. INFORMATICA 的调优之一 源数据的优化

    5W1H法来实现源数据的优化 做数据仓库项目的朋友都能感到数据质量和数据抽取展现的性能是整个数据仓库项目的重点.下面谈谈我在DW项目中处理源数据质量问题的5W1H方法. 5W : WHO ,WHAT, ...

  3. eclipse 快捷键Alt+/ 不能补充syso

    通过两步来解决 1:Window->Preferences->General->Keys,输入content assist,把Binding改成alt + / 2:在下面,有一个wh ...

  4. 从零开始学习Mysql的学习记录

    2015/06/18 16:23更新,由于QQ邮件的图片链接失效了,请在云笔记链接查看 http://note.youdao.com/share/?id=f0b2ed30a3fc8e57c381e3d ...

  5. oracle 创建字段自增长——两种实现方式汇总

    mysql等其他数据库中有随着记录的插入而表ID自动增长的功能,而oracle却没有这样的功能,我们有以下两种方式可以解决字段自增长的功能. 因为两种方式都需要通过创建序列来实现,这里先给出序列的创建 ...

  6. ejabberd常见配置说明

    1.数据库配置 ejabberd默认安装后使用的是自带的数据库,可以通过配置使用其他的数据库如Mysql.Sqlserver.Postgresql等数据库,Mysql数据库配置参见<Linux下 ...

  7. [转载]两个半小时学会Perl

    Learn Perl in about 2 hours 30 minutes By Sam Hughes Perl is a dynamic, dynamically-typed, high-leve ...

  8. 边工作边刷题:70天一遍leetcode: day 85-2

    Paint Fence 要点: 这题是求number of ways,如果是相邻不相同颜色,那么就trivial了:k*(k-1)^(n-1).所以这里no more than two adjacen ...

  9. python中的深拷贝和潜拷贝

    >>> a = ['ace',['age',10]] >>> b = a[:] >>> c = list(a) >>> for ...

  10. HOJ 2678 Stars

    题意:N个星星(x,y,z),星星的等级等于x,y,z都小于等于它的星星数量,问每个等级有多少星星. 思路:最暴力的方法是三维树状数组.但是会超内存.所以我们对其中一维先排好序,然后用二维的做. 代码 ...