您可以阻止innerHTML删除HTML，HEAD和BODY元素吗？

Question

我试图在应用程序中实现一个所见即所得，它们都使用contentEditable ，这很酷，直到我将整个HTML文档放入文本框中。 每个所见即所得都使用html()和innerHTML来移动内容，而这两个strip，和标签都...

html = "<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <title>Title</title>
  </head>
  <body>
    <span>Hey There</span>
  </body>
  </html>
  "

editable.innerHTML = html
editable.innerHTML
// => "
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <title>Title</title>
  <span>Hey There</span>
"

$(editable).html()发生同样的事情。 我找不到与此有关的规范。

做什么？

Answer 1

一个HTML文档只能有一个html ， body和head元素，而您的主页已经有这些元素。 之所以将其删除，是因为您试图将其插入不允许的位置。

您要么必须将它们全部去除，然后在编辑元素内容后将其重新添加，要么将整个WYSIWYG编辑器放入iframe元素中，这样就可以使用整个iframe文档，而不是单个元素。

它已记录在案，尽管您有点需要知道要查找的内容。 请参阅MDN上的<body>文档：

允许的父元素：它必须是元素的第二个元素。

以及来自<html>的文档：

允许的父元素：作为文档的根元素，或在复合文档中允许子文档片段的任何位置。

您可以阻止innerHTML删除HTML，HEAD和BODY元素吗？

问题描述

1 个解决方案

解决方案1
2 已采纳 2015-02-10 00:38:06

您可以阻止innerHTML删除HTML，HEAD和BODY元素吗？

问题描述

1 个解决方案

解决方案1 2 已采纳 2015-02-10 00:38:06

解决方案1
2 已采纳 2015-02-10 00:38:06