在元素内部插入节点
方法 | 说明 | 示例 |
---|---|---|
append(content) | 为所有匹配的元素的内部追加内容 | $(‘#B’).append(‘< p >A< /p >’); //向id为B的元素中追加一个段落 |
appendTo(content) | 将所有匹配元素添加到另一个元素的元素集合中 | $(‘#B’).appendTo(‘#A’);//将id为B的元素追加到id为A的元素后面,也就是将B元素移到A元素的后面 |
prepend(content) | 为所有匹配的元素的内部前置内容 | $(‘#B’).prepend(‘< p>A< /p>’);向id为B的元素内容前添加一个段落 |
prependTo(content) | 将所有匹配的元素前置到另一个元素的元素集合中 | $(‘#B’).prependTo(‘#A’);将id为B的元素添加到id为A的元素前面,也将是将B元素放在A元素的前面。 |
在元素外部插入节点的方法
方法 | 说明 | 示例 |
---|---|---|
after(content) | 在每个匹配的元素之后插入内容 | $(‘#B’).after(‘< p >A< /p >’); //向id为B的元素后面添加一个段落 |
insertAfter(content) | 将所有匹配的元素插入到另一个指定元素的元素集合的后面 | $(‘< p>test< /p>’).insertAfter(‘#B’);//将要添加的段落插入到id为B的元素的后面 |
before(content) | 在每个匹配的元素之前插入内容 | $(‘#B’).before(‘< p >A< /p >’); //向id为B的元素前面添加一个段落 |
insertBefore(content) | 将所有匹配的元素插入到另一个指定元素的元素集合的前面 | $(‘< p>test< /p>’).insertBefore(‘#B’);//将要添加的段落插入到id为B的元素的前面 |
删除、复制和替换节点
方法 | 说明 | 示例 |
---|---|---|
empty() | 删除节点 | 删除匹配的元素集合中所有的子节点,并不删除该元素 |
remove() | 删除节点 | 删除所有匹配的元素 |
clone(boolean) | 复制节点 | 默认false,复制匹配的元素但不匹配处理事件;参数为true时,复制所有匹配的元素以及其所有的事件处理并且选中这些克隆的副本。 |
replaceWith(content) | 替换节点 | 用于将所有匹配的元素替换成指定的HTML或DOM元素:$(‘#div1’).replaceWith(‘< div>replaceWith()方法的替换结果< /div>’) |
replaceAll(selector) | 替换节点 | 用于使用匹配的元素替换掉所有selector匹配到的元素:$(‘< div>replaceWith()方法的替换结果< /div>’).replaceAll(‘#div2’) |