我正在寻找一种使用JQuery删除html标签(打开和关闭)而不会打扰内容的技术。
例如,给定此标记......
<div id="myDiv">
Leave My Content alone!
</div>
我想谈谈......
<span id="mySpan">
Leave My Content Alone!
</span>
我尝试了什么:
我想到了$(“#myDiv”)。remove或$(“#myDiv”)。replaceWith,但它们都破坏了标签的内容。
一如既往,感谢您的协助!
答案 0 :(得分:12)
最简单的方法是做这样的事情:
$("#myDiv").replaceWith('<span id="mySpan">' + $("#myDiv").html() + "</span>");
然而,当您意识到您将失去<div />
内任何元素的所有活动订阅者时就会崩溃。更好的方法是将内容移动到<span />
标记之前的新<div />
标记,然后删除<div />
,如下所示:< / p>
var yourDiv = $("#myDiv");
var yourSpan = $('<span id="mySpan"></span>');
yourDiv.before(yourSpan);
yourSpan.append(yourDiv.children());
yourDiv.remove();
这将“更改”换行标记,而不会丢失<div />
标记内的实际元素。所有活动订阅者都应保留在<div />
内的任何元素。
答案 1 :(得分:1)
查看replaceWith
方法的example。我知道你说你知道它,但我认为你是以错误的方式使用它。以下是它提到的内容片段:
$("button").click(function () {
$(this).replaceWith("<div>" + $(this).text() + "</div>");
});
虽然您可能希望使用$(this).html()
代替$(this).text()
。仍然建议你看看页面。点击按钮,看它确实正在按照它说的那样做:)很抱歉,如果我误解了你的问题。
答案 2 :(得分:1)
我建议您将innerHTML值保存为字符串,然后可以替换或删除并添加新元素,然后设置new值的innerHTML。
另一种解决方案是转到要替换的元素的父级,并更改innerHTML属性,将<div>
和</div>
替换为<span>
和{{1} }。
这个有点棘手,特别是因为你需要确定如果你在innerHTML中有多个div,那么你只需要替换一个感兴趣的div。