javascript - 删除 javascript 字符串中的元素

Question

我有一个包含 html 元素的字符串，现在我需要选择一些元素并将它们从字符串中删除。在 JQuery 中，我尝试了以下操作:

html_string = "<ul><li data-delete>A<li><li>B</li></ul>";
html_clean_string = $(html_string).remove('[data-delete]').html();

这是我所期望的:

"<ul><li>B</li></ul>"

但我得到了相同的原始字符串。那么如何使用 CSS 选择器从字符串中删除 html 元素呢？

Answer 1

你可以这样做:

var html_string = "<ul><li data-delete>A</li><li>B</li></ul>";
var elems = $(html_string);
elems.find('[data-delete]').remove();
var html_clean_string = elems[0].outerHTML;

您有几个问题:

1. .remove() 仅对 jQuery 对象中的元素进行操作，而不对子对象进行操作，因此您必须 .find() 适当的子元素在你可以删除它们之前。

2. 由于您还需要宿主顶级 HTML，因此您将需要 .outerHTML。

3. 您的 html_string 中有错误。

工作 jsFiddle:http://jsfiddle.net/jfriend00/x8ra6efz/

---

您还可以像这样使用更多链接来节省一点 jQuery:

var html_string = "<ul><li data-delete>A</li><li>B</li></ul>";
var html_clean_string = $(html_string).find('[data-delete]').remove().end()[0].outerHTML;

工作 jsFiddle:http://jsfiddle.net/jfriend00/wmtascxf/