Question

要从tinyMCE内容中删除默认<p>标记，我创建了一个div，用于存储来自tinyMCE的内容（包括<p>标记）。然后，通过使用find方法find('p:first').html()，我检索标记内的html文本。它工作得很好，我可以摆脱<p>标签。但是，使用此方法，例如，列表标记ul在内容中丢失。我没试过，但其他html标签也可能会丢失。您是否发现我的代码存在任何问题：

var newcontent = tinymce.get('textarea_1').getContent();
//this returns a p tag that can have hold any content: 
//<p>content goes here <ul><li>a</li></ul>...</p>

var mydiv = $("<div>").html(newcontent);

newcontent =  mydiv.find('p:first').html();
//here I just want to get rid of <p> tag
//however I also got <ul> list items removed.

更新

我尝试了以下代码，但我得到mydiv的innerHtml为空：

 var postcontent = tinymce.get('inputPostDetails').getContent();

 var mydiv = $("<div>").html(postcontent);
 mydiv.replaceWith(mydiv.children());

Answer 1

由于目前缺乏代表，我无法在评论中发帖提问。

根据我对您的html结构的理解，如果您删除了<p>代码，那么其中的内容也会消失。

<div>
  <p> <!-- removing this will be removing its content too -->
    <ul>
      <li>#1</liv>
      <li>#2</liv>
    </ul>
  </p>
</div>

您打算删除<p>标记但不删除其内容吗？你能解释一下你想做什么吗？：）

编辑：HTML specifies that <ul> tags are not to be inside of <p> tags

我已将<p>替换为<div>，我想出了这个

的使用Javascript：

// Simulating loading contents into the myDiv function getContent(){ return "<div id='removeMe'><ul><li>#1</li><li>#2</li></ul></div>"; } var postcontent = getContent(); var mydiv = $("div").html(postcontent); // jQuery selector for tags do not need <> signs // Removing P tag but keep contents function removeP(){ var replaceThisElement = mydiv.find("#removeMe"); var contents = replaceThisElement.html(); $("div > #removeMe").replaceWith(contents + "<div>element removed!</div>"); }

<强> HTML：

<button onclick="removeP()">Remove P tag but keep contents</button> <div> </div>

Working example here

Answer 2

以下是一个示例，https://jsfiddle.net/7denp9h0/

var p = $('#removeMe');
p.replaceWith(p.children())

如何用它包含的子元素替换元素？

2 个答案: