在jQuery中，如果我們想要替換節點，有2種方法：
replaceWith()方法可以將所選元素被替換成其他元素。
語法：
$(A).replaceWith(B)
說明：
$(A).replaceWith(B)表示用B來替換A。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="../App_js/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btn").click(function () {
$("strong").replaceWith('<a href="http://www.lvyestudy.com" target="_blank"> 學習網</a>');
});
})
</script>
</head>
<body>
<ul>
<li><strong>HTML</strong></li>
<li><strong>CSS</strong></li>
<li><strong>JavaScript</strong></li>
<li><strong>jQuery</strong></li>
<li><strong>canvas</strong></li>
</ul>
<input id="btn" type="button" value="replaceWith替換"/>
</body>
</html>
在浏覽器預覽效果如下：
當我們點擊“替換”按鈕之後，預覽效果如下：
replaceAll()跟replaceWith()相似，作用都是用來替換節點的。不過這兩者的“使用方式”是顛倒操作。
語法：
$(A).replaceAll(B)
說明：
$(A).replaceAll(B)表示用A來替換B。
對於replaceWith()和replaceAll()這兩個方法，我們也可以借助英文意思來幫助我們區分和記憶。
舉例：
在線測試
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="../App_js/jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btn").click(function () {
$('<a href="http://www.lvyestudy.com" target="_blank"> 學習網</a>').replaceAll("strong");
});
})
</script>
</head>
<body>
<ul>
<li><strong>HTML</strong></li>
<li><strong>CSS</strong></li>
<li><strong>JavaScript</strong></li>
<li><strong>jQuery</strong></li>
<li><strong>canvas</strong></li>
</ul>
<input id="btn" type="button" value="replaceAll替換"/>
</body>
</html>
在浏覽器預覽效果如下：
當我們點擊“替換”按鈕之後，預覽效果如下：
分析：
replaceAll()和replaceWith()這兩種方法是等價的，replaceAll()是顛倒了replaceWith()的使用方式罷了。
$("strong").replaceWith('<a href="http://www.lvyestudy.com" target="_blank"> 學習網</a>');
$('<a href="http://www.lvyestudy.com" target="_blank"> 學習網</a>').replaceAll("strong");
上面這兩個代碼是等價的。如果在替換節點之前，我們已經為元素綁定事件了，使用replaceWith()或replaceAll()之後，該元素所綁定的事件會消失。因此我們如果想要保留事件的話，則需要在新元素上重新綁定事件。關於“jQuery綁定事件”，我們在後續章節會詳細介紹。