javascript - 如何将 HTML 文档作为起始值传递给 CodeMirror?

标签 javascript html xml formatting codemirror

我有一个存储在字符串中的 HTML 文档,如下所示:

var htmlAsString = "<!DOCTYPE html><html><head>........";

我尝试使用上面的 HTML 文档初始化我的 CodeMirror 编辑器,如下所示:

var cm = CodeMirror($('#some-div')[0], {
  value: htmlAsString,
  mode: "htmlmixed",
  autofocus: true,
  lineNumbers: true
});

但是,所做的只是创建一个代码镜像编辑器,其中包含一个不可单击的行,其中包含 htmlAsString 字符串。

我显然希望我的 Code Mirror 编辑器能够使用所有良好的 xml 格式的 HTML(缩进、嵌套、间距、换行等)进行初始化,以便开发人员可以使用 Code Mirror 来编辑/更新HTML。

我做错了什么?

最佳答案

您的 HTML 字符串不包含任何换行符或制表符/空格。

您需要做的是通过 HTML 格式化程序解析您的字符串。

CodeMirror 有一个格式化实用程序,包含 formatting.js

这是一个工作演示: http://codemirror.net/2/demo/formatting.html

初始化代码镜像后,您将需要执行类似于以下代码的操作。

var cm = CodeMirror($('#some-div')[0], {
  value: htmlAsString,
  mode: "htmlmixed",
  autofocus: true,
  lineNumbers: true
});

var totalLines = cm.lineCount();  
cm.autoFormatRange({line:0, ch:0}, {line:totalLines});

关于javascript - 如何将 HTML 文档作为起始值传递给 CodeMirror?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29022186/

相关文章:

javascript - typescript 混合类型

javascript - XML 到 HTML 的问题

php - 如何避免多次重新加载 XML 文档?

html - IE9 下移列

android - 更改搜索栏颜色

python - 如何使用 xml.dom 中的 minidom 获取字符串形式的内部内容?

javascript - 在加载对象标签数据之前显示图像

javascript - jQuery/JavaScript - trim 两个元素之间的空白/制表符?

html - 动态布局的问题

python - 使用 Python 访问不断变化的网页元素