在 WYSIWYG 编辑器中编辑 <html>、<head>、<body> 等答案

【问题标题】：Editing <html>, <head>, <body> etc. in WYSIWYG editor在 WYSIWYG 编辑器中编辑 <html>、<head>、<body> 等
【发布时间】：2013-09-25 09:05:40
【问题描述】：

我正在使用 WYSIHTML5 编辑器：http://xing.github.io/wysihtml5/

每当您更改 iFrame 的 contenteditable 正文时，此编辑器都会向页面添加 iFrame 并更新 textarea。它类似于许多其他所见即所得的编辑器，所以我的问题应该适用于其他编辑器。

我的问题是我希望能够通过这个编辑器编辑<html>、<head>、<body> 和其他重要的基本标签。你显然不能在 WYSIWYG 模式下编辑它们，所以原始代码模式就可以了。

当我启用这些标签时，它们会被浏览器本身剥离，因为这些标签已经被 iFrame 本身中的页面打开。所以当我在原始代码和所见即所得模式之间切换时，它们就会丢失。

我使用默认的“高级”解析器规则并将它们与这些规则合并：http://pastebin.com/6QvYkqm4 与 jQuery 的递归 $.merge()。

我怎样才能解决这个问题但仍然使用这个插件？我是否错误配置了插件？我确定我已经在解析器规则中启用了标签。

【问题讨论】：

拆分 (//i)[0] 以填充编辑器，然后夹回以保存。您可以在 textarea 中编辑头部或转义 xml 实体并在 contenEditable div 中进行编辑。为了简单起见，我推荐一个 textarea 。所见即所得编辑器的整体“编辑为 html”切换对于开发工作非常方便。

标签： javascript jquery html iframe wysihtml5

【解决方案1】：

我强烈推荐你使用JQuert TE WYSIHTML textarea 编辑器，虽然它有问题，但与许多其他的相比，它要好得多。

构建 WYSIHTML 编辑器的 JavaScript 库会搜索这些标签并将其删除，因为这是一个安全漏洞，如果不这样做，它可能会扭曲站点布局。想象一下，如果用户更改页面的标题。如果您真的想实现这些功能，我建议您在 WYSIHTML5 的库中找到删除这些标签的代码，并将其更改为无法识别这些特定标签。祝你好运。

编辑：

示例：在 WYSIHTML5 的 parser_rules 文件夹中选择 advanced.js 或 basic.js（取决于您使用的是什么）找到：

"head": {
        "remove": 1
},

替换为：

"head": {
        "rename_tag": "head"
    },

使用不同的规则重复此过程，直到您拥有所需的规则集。 WYSIWYG textarea 编辑器都有不同的 JavaScript 库，但您使用的那个很容易编辑。

【讨论】：

去除head和body的不是js所见即所得的lib，是浏览器的html解析器...

【解决方案2】：

WYSIWYG 编辑器不是您正在寻找的解决方案，因为您无法“看到”（带有样式的格式）head 或页面标记。你应该看看http://codemirror.net/

HTML example page

【讨论】：