你能阻止innerHTML删除HTML,HEAD,BODY元素吗?

时间:2015-02-10 00:34:57

标签: javascript jquery html

我正在尝试将wysiwyg实现到应用程序中,它们都使用contentEditable这很酷,直到我将整个html文档放入文本框中。每个wysiwyg使用html()innerHTML来移动内容以及这些条带和标签......

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()完全相同的事情。我找不到有关此的规范。

做什么?

1 个答案:

答案 0 :(得分:1)

HTML文档只能包含一个htmlbodyhead元素,而您的主页已经包含这些元素。它正在剥离它,因为你试图将它们插入不允许的位置。

您必须完全删除它们,然后在编辑元素内容后重新添加它们,或者将整个WYSIWYG编辑器放在iframe元素中,以便拥有整个iframe文档使用而不是单个元素。

记录在案,尽管您需要知道自己在寻找什么。请参阅MDN上的<body>文档:

  

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

以及<html>的文档:

  

允许的父元素:作为文档的根元素,或复合文档中允许使用子文档片段的任何位置。