JQuery：如何在不干擾內容的情況下替換標籤？

我正在尋找一種技術，使用JQuery刪除一個html標記（無論是打開還是關閉），而不會干擾內容。JQuery：如何在不干擾內容的情況下替換標籤？

例如，假設此標記...

<div id="myDiv"> 
    Leave My Content alone! 
</div>

我想這個......

<span id="mySpan"> 
    Leave My Content Alone! 
</span>

我已經試過：
我想大約$（「＃myDiv」）。remove或$（「＃myDiv」）。replaceWith，但是它們都銷燬標籤的內容。

一如既往，您的幫助表示感謝！

來源

2009-11-08 JohnFx

要做到這一點是做這樣的事情最簡單的方法：

$("#myDiv").replaceWith('<span id="mySpan">' + $("#myDiv").html() + "</span>");

然而，當你意識到你會失去你的<div />內的任何元素的所有事件訂閱者是分崩離析。一個更好的辦法來做到這一點是移動內容到一個新的<span />標籤只是<div />標籤之前，然後取出<div />，就像這樣：

var yourDiv = $("#myDiv"); 
var yourSpan = $('<span id="mySpan"></span>'); 
yourDiv.before(yourSpan); 
yourSpan.append(yourDiv.children()); 
yourDiv.remove();

這將「改變」不失包裝標籤您的<div />標籤內的實際元素。所有活動用戶應保留在<div />內的任何元素上。

來源

2009-11-08 02:53:44

yourSpan.append（yourDiv.children（））;似乎沒有爲我抓取文本元素，我不得不使用yourSpan.append（yourDiv.contents（））;代替。 – hharnisc 2014-01-07 17:44:06

我急於複製粘貼（那個押韻...），我忽略了@hharnisc關於.contents（）的評論。所以我調試了一下，發現了同樣的東西。： - /感謝您發佈答案，但是您可以更新它來說'yourDiv.contents（）'？ – HostileFork 2014-03-13 06:04:00

看看replaceWith方法的example。我知道你說過你知道這件事，但我認爲你是以錯誤的方式使用它。下面是什麼它提到一個片段：

$("button").click(function() { 
    $(this).replaceWith("<div>" + $(this).text() + "</div>"); 
});

雖然你可能想使用$(this).html()而不是$(this).text()。儘管如此，仍然建議你看一下頁面。點擊按鈕，看看它真的在做它說的它會做:)如果我誤解了你的問題，很抱歉。

來源

2009-11-08 02:48:18

不。如果我是在事件處理程序中執行此操作，那實際上是一個好點。唯一的原因是不能工作的是，我正在做一個倍數，「this」將不可用。例如用跨度$（「div」）替換所有的div。replaceWith（...） – JohnFx 2009-11-08 02:56:10

啊，好吧，對不起，我誤解了。 – 2009-11-08 03:00:14

如果你按照你所說的去做，你不能只是遍歷它們嗎？如$（「div」）。each（function（i）{this.replaceWith（...）;}）; HTTP：//docs.jquery。com/Core/each – 2009-11-08 03:06:51

我建議您將innerHTML值保存爲字符串，然後您可以替換或刪除並添加新元素，然後設置新值的innerHTML。

另一個解決方案是去要替換的元素的父元素，並更改文字屬性，與<span>和</span>更換<div>和</div>。

這一個有點棘手，尤其是你需要確定，如果你在innerHTML中有多個div，你只需要替換一個感興趣的。

來源

2009-11-08 02:54:36

JQuery：如何在不干擾內容的情況下替換標籤？

回答

相關問題