PageKit — 可自托管的 GrapesJS 建站工具,附完整源码。 获取抢先体验

问题 #5857💬 已回答提出于 2024年5月2日作者 hasan-aa0 个反应

在渲染<tr>标签内的标签<template>时,标签会被裁剪,只保留字符串内容。

快速解答作者 GJS Helper

这确实是处理在独立上下文中无效的HTML片段时的已知行为,比如<table>元素外的<tr>或<td>标签。GrapesJS,像许多HTML解析器一样,依赖浏览器原生的DOM解析机制(例如,innerHTML在div或DOMParser上)。 根本原因 浏览器中的默认HTML解析机制(因此在GrapesJS的parserHtml中默认如此)会隐式纠正或删除在特定上下文中被认为无效的HTML元素。当你提供一个HTML字符串,比如<tr><td>Cell content</td></tr>到通用元素(如div)的innerHTML时,浏览器解析器通常会剔除<tr>和<td>标签,因为它们在标准解析上下文中不是div或文档片段的有效直接...

阅读下方完整回答 ↓

问题

GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Chrome v121可复制演示链接 https://jsfiddle.net/L27powtg/30/(修复也在那里,评论中删除了)描述一下那个虫子 如何复现这个漏洞?创建自定义的GJS模板标签组件,详见此处说明:https://github.com/GrapesJS/grapesjs/issues/244#issuecomment-324449748添加一个带有表行的模板组件作为子节点。例如: 检查 editor.toHTML() 的结果。 预期的行为是什么? toHTML 的结果不应修剪 tr, td 标签。 目前的行为是什么? 结果的HTML字符串缺少TR、TD标签。 如果需要执行某些代码以重现该漏洞,请将其粘贴到下面: 我已经为这个问题实现了一个自定义 parserHtml 函数。如果这样说得通的话,可以集成到BrowserParserHtml.ts文件里。 实际上,DOMParser是在裁剪标签,因为它认为 tr 标签作为根标签无效。 用 template 标签包裹内容后,它又是有效的 HTML,且不会发生修剪。这大概能解决大多数甚至所有类似问题: 顺便说一句,感谢你提供这个很棒的工具! 行为准则[X] 我同意遵守本项目的行为准则

回答(1)

GJS Helper• 2026年5月17日

这确实是处理在独立上下文中无效的HTML片段时的已知行为,比如<table>元素外的<tr>或<td>标签。GrapesJS,像许多HTML解析器一样,依赖浏览器原生的DOM解析机制(例如,innerHTML在div或DOMParser上)。 根本原因 浏览器中的默认HTML解析机制(因此在GrapesJS的parserHtml中默认如此)会隐式纠正或删除在特定上下文中被认为无效的HTML元素。当你提供一个HTML字符串,比如<tr><td>Cell content</td></tr>到通用元素(如div)的innerHTML时,浏览器解析器通常会剔除<tr>和<td>标签,因为它们在标准解...

相关问答

通过相似的问题讨论继续研究。

与此问题匹配的付费插件

根据问题关键词和标签相关性精选,助你更快交付。

查看全部插件

正在加载付费插件推荐……

免费方案

在以下平台查看开源 GrapesJS 插件: GitHub 或在我们的免费目录中快速搜索。

浏览免费插件 →
高级方案

高级插件提供支持、定期更新和生产就绪的功能——为你节省数天的集成工作。

浏览高级插件 →

相关教程

关于同一主题的深入指南。

全部教程 →

浏览插件分类

直接跳转到市场上的插件分类页面。