A-A+
jQuery中after() before()和remove()元素替换
对于元素替换人我们多半不会使用到after() before()和remove()这种个函数,但今天看到有一种寅出来了我们就分享一下吧。
after() 函数
after() 方法在被选元素后插入指定的内容。
before()函数
before() 方法在被选元素前插入指定的内容。
remove()函数
remove() 方法移除被选元素,包括所有文本和子节点
该方法不会把匹配的元素从 jQuery 对象中删除,因而可以在将来再使用这些匹配的元素。
但除了这个元素本身得以保留之外,remove() 不会保留元素的 jQuery 数据。其他的比如绑定的事件、附加的数据等都会被移除。这一点与 detach() 不同。
例子,元素替换,代码如下:
- /*
- * 将A替换成B
- * after(B)将B插入到A的后面并返回包含A的包装集
- * remove()删除前面的包装集A
- **/
- $(A).after(B).remove();
- //简单的插件封装
- $.fn.replaceWidth(ele){
- return this.after(ele).remove();
- }
补充另外两种例子
1.replaceWith()
使用括号内的内容替换所选择的内容,代码如下:
- $("#div").replaceWith("<div id="div2">div2</div>");
使用方法如上,将ID为div的元素替换为ID为div2的DIV元素。
2.replaceAll()
将选择的内容替换到括号内的选择器,代码如下:
- $("<div>替换后的内容</div>").replaceAll("p");
使用方法如上,将所有的p标签替换为选择的DIV标签。