jQuery的replaceWith和replaceAll方法有什么不同?
jQuery 有两个方法 replaceWith 和 replaceAll,它们都是用来替换目前元素的,并且看起来也很像,那它们有什么区别呢?
最简单的理解就是:replaceWith 是把前面的替换成后面的;replaceAll 则是把后面的替换成前面的。
我们来看具体的例子,假设有如下代码:
<div class="dowebok"> <div class="inner first">Hello</div> <div class="inner second">And</div> <div class="inner third">Goodbye</div> </div>
1、使用 replaceWith 方法:
$('.second').replaceWith('<h2>New text</h2>')
得到的结果是:
<div class="dowebok"> <div class="inner first">Hello</div> <h2>New text</h2> <div class="inner third">Goodbye</div> </div>
回到上面的 js 代码,也就是前面的 .second 元素被替换成了后面的 <h2>New text</h2>
。
2、如果使用 replaceAll 方法:
$('<h2>New heading</h2>').replaceAll('.second')
得到的结果如下(和上面一样):
<div class="dowebok"> <div class="inner first">Hello</div> <h2>New text</h2> <div class="inner third">Goodbye</div> </div>
回到上面的 js 代码,也就是后面的 .second 的元素被替换成了前面的 <h2>New text</h2>
。
现在明白了 replaceWith 和 replaceAll 区别了吧。