替换jQuery非DOM对象中的元素之一

Question

html = "<p>title</p><div><ul class='www'></ul>something</div>";
$html = $(html);
$html.filter('p').replaceWith('<h2>' + $html.filter('p').html() + '</h2>'); //not working 
container = $('<div></div>');
html = container.html($html)[0].innerHTML; //trying to output "<h2>title</h2><div><ul class='www'></ul>something</div>"

在非DOM环境中，我试图修改HTML字符串，以替换其成员之一。 jQuery的replaceWith不起作用，因为它用于DOM。 我该怎么做呢？

Answer 1

看例子。 首先，我删除B，然后将其放在A之前。之后，我插入一个新的C。您可以用所有内容替换A，B和C。

重要的是，您手动删除并添加/添加了它：)

 a = $('#a'); b = $('#b'); c = $('<span>').attr('id', 'c').text('C'); b.remove(); a.prepend(b); a.append(c); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="parent"> <span id="a">A</span> <span id="b">B</span> </div> 

Answer 2

尽管已替换了该元素，但是$html不会更新，因为p在$html变量的根目录中

 html = "<p>title</p><div><ul class='www'></ul>something</div>"; $container = $('<div></div>'); $container.html(html); $container.find('p').replaceWith(function(idx, html) { return '<h2>' + html + '</h2>' }) html = $container[0].innerHTML; console.log(html) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>