DOM—外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()...

外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()

1 .after(content)在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点

2 .before(content）据参数设定，在匹配元素的前面插入内容

3 .after()和.before()共同点

都是用来对相对选中元素外部增加相邻的兄弟节点

都可以接收HTML字符串、DOM元素、元素数组，或者JQuery对象，用来插入到集合中每个匹配元素的前面或者后面

都支持多个参数传递after（div1，div2，...）

4 .after()和.before()不同

after向元素的后边添加html代码，如果元素后面有元素了，将后面的元素后移，然后将html代码插入

before向元素的前边添加html代码，如果元素前面有元素了，将前面的元素前移，然后将html代码插入

5 prepend向每个匹配的元素内部前置内容

6 prependTo把所有匹配的元素前置到另一个指定的元素集合中

7 .prepend()和.prependTo()的区别

.prepend()将指定元素插入到匹配元素里面作为他的第一个子元素（如果要作为最后一个子元素插入用.append()）

.prepend()和.prependTo()语法、插入的内容和目标的位置不同

.prepend()选择器表达是写在方法的前面，作为待插入内容的容器，将要被插入的内容作为方法的参数

.prependTo()正好相反，将要被插入的内容写在方法的前面，可以是选择器表达式或动态创建的标记，待插入内容的容器作为参数

8 .prepend()和.prependTo()实现同样的功能，都是在被选元素之前插入

9 insertBefore在目标元素前面插入集合中每个匹配的元素

10 insertAfter在目标元素后面插入集合中每个匹配的元素

11 insertAfter将JQuery封装好的元素插入到指定元素的后面，如果元素后面有元素了，将后面的元素后移，然后将JQuery对象插入

12 insertBefore将JQuery封装好的元素插入到指定元素的前面，如果元素前面有元素了，将前面的元素前移，然后将JQuery对象插入

13 .before()和.insertBefore()实现同样的功能

14 .before()和.insertBefore()的区别

主要是语法、内容和目标的位置不同

.before()选择表达式在函数前面，内容作为参数

.insertBefore()刚好相反，内容在方法前面，被放在参数里元素的前面

15 .after()和.insertAfter()实现相同的功能

16 .after()和.insertAfter()的区别

主要是语法、特别是（插入）内容和目标的位置不同

.after()选择表达式在函数的前面，参数是将要插入的内容

.insertAfter()刚好相反，内容在方法前面，被放在参数里元素的后面

转载于:https://blog.51cto.com/lakaodekaola/1983168

DOM—外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()...相关推荐

js添加多个子节点_JS实现DOM节点插入操作之子节点与兄弟节点插入操作示例
本文实例讲述了JS实现DOM节点插入操作之子节点与兄弟节点插入操作.分享给大家供大家参考,具体如下: www.jb51.net JS节点插入 function showinsert(){ //添加子节 ...
js学习-DOM之动态创建元素的三种方式、插入元素、onkeydown与onkeyup两个事件整理...
动态创建元素的三种方式: 第一种: Document.write(); <body> <input type="button" id="btn" ...
js追加元素的几种方法（append()、prepend()、after()、before()、insertAfter()、insertBefore()）...
[html] view plain copy <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...
DOM——创建节点及节点属性与内部插入append()和appendTo()
创建节点及节点属性与内部插入append()和appendTo() 1 创建流程创建节点(常见的元素.属性和文本) 添加节点的一些属性加入到文档中 2 流程中涉及的方法创建元素docum ...
jQuery 学习-DOM篇（二）：jQuery 在 DOM 内部插入元素
推荐阅读 Helm3(K8S 资源对象管理工具)视频教程:https://edu.csdn.net/course/detail/32506 Helm3(K8S 资源对象管理工具)博客专栏:https: ...
SqlBulkCopy与触发器，批量插入表(存在则更新,不存在则插入)
原文:SqlBulkCopy与触发器,批量插入表(存在则更新,不存在则插入) 临时表:Test /****** 对象: Table [dbo].[Test] 脚本日期: 05/10/2013 11:4 ...
html中的插入特殊符号的方法,在Word2016中插入特殊符号的方法
在Word2016文档中输入符号和输入普通文本有些不同,虽然有些输入法也带有一定的特殊符号,但是Word的符号样式库却提供了更多的符号供文档编辑使用.直接选择这些符号就能插入文档中.本文图文介绍在Wo ...
在Sql2005中，向表中插入数据时遇到uniqueidentifier列，如何插入数据？
在Sql2005中,向表中插入数据时遇到uniqueidentifier列,如何插入数据? 原文 http://blog.csdn.net/quou2002/article/details/59650 ...
mysql插入语句例句,一句简单的MySql插入语句怎么写 ?
守候你守候我 insert into 表名 values(default,"名字","2011-04-15 12:22:25"); //default可以换成n ...
tex插入excel图表_Excel：以编程方式插入图表。
tex插入excel图表 As we all know that a Chart is a graphical representation of data. Charts help us to vi ...

DOM—外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()...

DOM—外部插入.after()、.before()、.insertAfter()和.insertBefore()与内部插入.prepend()和.prependTo()...相关推荐

最新文章

热门文章