jquery - Jquery用另一个替换内部div

Question

我正在尝试用新的 div 替换嵌套的 div。

html_string= "<div id='container'><div id='inner'></div></div>";

var newHtml = $(html_string).find("div#inner").replaceWith("<div>NEW CONTENT</div>").html();

console.log('new html is');
console.log(newHtml);
console.log('html_string is');
console.log(html_string);

但是我得到一个输出

new html is

html_string is 
<div id='container'><div id='inner'></div></div> 

换不来...

Answer 1

尝试

html_string= "<div id='container'><div id='inner'></div></div>";

var newHtml = $(html_string).find("div#inner").replaceWith("<div>NEW CONTENT</div>").end().get(0).outerHTML;

console.log('new html is');
console.log(newHtml);
console.log('html_string is');
console.log(html_string);

演示：小提琴

Answer 2

打破它一点：

html_string = "<div id='container'><div id='inner'></div></div>";
var newHtml = $(html_string)
newHtml.find("div#inner").replaceWith("<div>NEW CONTENT</div>");

console.log('new html is:' + $(newHtml)[0].innerHTML);
console.log('html_string is' + $(html_string)[0].innerHTML);

请注意 - html_string 是一个字符串并且保持不变。- newHtml 是一个 jQuery 对象并被更改。

输出

>  new html is:<div>NEW CONTENT</div>
>  html_string is<div> id="inner"></div>