是否可将HTML字符串转换为EditorJS可识别的JSON格式？

EditorJS 仅支持通过符合自身块结构规范的 JSON 数据初始化内容，无法直接解析原生HTML字符串，所有实现方案的核心逻辑都是完成HTML节点到标准化Block结构的映射转换，转换完成后将结果传入编辑器初始化的 data 配置项即可完成内容加载。

可落地的实现路径 #

• 自定义逐DOM节点解析方案
  借助浏览器原生提供的 DOMParser 接口将HTML字符串解析为可遍历的DOM树，提前定义好标签与EditorJS块类型的映射规则，逐节点提取文本、属性信息，拼接生成符合Schema要求的块结构。
  这种方案的可控性最高，可以针对特殊场景自定义匹配逻辑，比如对<video>、自定义业务标签做专属转换规则，完全适配项目的实际需求。
• 社区封装的转换工具方案
  可以直接使用社区已封装好的HTML到EditorJS结构的转换工具，传入HTML字符串即可输出基础的Blocks数组，只需要针对video这类特殊媒体节点补充少量自定义转换规则，就能快速完成接入，适合对开发效率要求较高的场景。
• Raw块兜底方案
  不需要做精细的标签映射时，可以直接将整段HTML作为Raw HTML块的内容注入编辑器，缺点是这类内容仅能作为静态HTML展示，无法被EditorJS的原生块编辑能力操作，灵活性较差。

给定示例HTML的转换结果 #

按照EditorJS的JSON结构规范，结合你提供的结构范式，针对示例HTML的转换结果如下：

{
    "time" : 1616822242088,
    "blocks" : [ 
        {
            "type" : "header",
            "data" : {
                "text" : "The video src attribute",
                "level" : 1
            }
        },
        {
            "type" : "video",
            "data" : {
                "file" : {
                    "url" : "movie.ogg"
                },
                "width" : 320,
                "height" : 240,
                "controls" : true,
                "caption" : "Yourbrowser does not support the video tag."
            }
        },
        {
            "type" : "paragraph",
            "data" : {
                "text" : "<b>Note:</b> The .ogg fileformat is not supported in old IE and Safari."
            }
        }
    ],
    "version" : "2.19.3"
}

注：示例中video块的字段结构参考了你提供的image块的设计范式，如果项目中使用的video插件定义了不同的Schema，只需要对应调整data内的字段名即可，核心逻辑是保证块结构和插件的要求完全匹配。

内容的提问来源于stack exchange，提问作者Duơng Bảo Nam