如何將轉換后的文本字符串還原為原始HTML布局？

Question

這個問題源自Jquery的接受答案- 如何替換div中的一個單詞？

下面的代碼將檢測<div>的特定單詞，將檢測到的單詞更改為另一個單詞，然后使用.text()方法渲染<div>的所有內容。 雖然這是一個可行的解決方案，但是有可能在保留新創建的文本字符串的同時自動將文本字符串轉換回原始HTML布局格式嗎？

也就是說，新的輸出應保持換行符<br/> ，但它不應該被限制到只有他們（所有的HTML應保持）。

HTML：

<div class="dealer-addy">
    8726 N. Royal Ln<br>
    Irving, TX  75063<br>
    email@aol.com
</div>

jQuery的：

var text = $(".dealer-addy").text(); 

function extractEmails ( text ){
    return text.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi) ;
}

var email = extractEmails(text);
var value = $(".dealer-addy").text();

value = value.replace(email, "new@email.com"); 
$(".dealer-addy").text(value);

輸出：

8726 N. Royal Ln Irving, TX 75063 new@email.com

期望的輸出：

8726 N. Royal Ln<br/>
Irving, TX 75063<br/>
new@email.com

小提琴

 var text = $(".dealer-addy").text(); function extractEmails ( text ){ return text.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\\.[a-zA-Z0-9._-]+)/gi) ; } var email = extractEmails(text); var value = $(".dealer-addy").text(); value = value.replace(email, "new@email.com"); $(".dealer-addy").text(value); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <div class="dealer-addy"> 8726 N. Royal Ln<br> Irving, TX 75063<br> email@aol.com </div> 

Answer 1

您應該使用jQuery.html而不是文本。

var text = $(".dealer-addy").html(); 

function extractEmails ( text ){
    return text.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+\.[a-zA-Z0-9._-]+)/gi) ;
}

var email = extractEmails(text);
var value = $(".dealer-addy").html();

value = value.replace(email, "new@email.com"); 
$(".dealer-addy").html(value);

http://jsfiddle.net/pyfbfuo9/