在渲染<tr>标签内的标签<template>时,标签会被裁剪,只保留字符串内容。
这确实是处理在独立上下文中无效的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)
这确实是处理在独立上下文中无效的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>标签,因为它们在标准解...
相关问答
通过相似的问题讨论继续研究。
问题 #3779
Editor.getSelected().toHTML() encodes inline javascript
GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? 最新款(镀铬)可复制演示链接 https://jsfiddle.net/4j1k0wde/24/描述一下那个虫子 如何复现这个漏洞?创建带有脚本标签的方块。使用 editor.getSele...
问题 #4083
Set root does not work
GrapesJS 版本[X] 我确认使用最新版本 GrapesJS你用的是什么浏览器? Safari 15.0可复制演示链接 https://jsfiddle.net/adw6y12f/9/描述一下那个虫子 你好, 我正在尝试按照[这里](https://github.com/...
问题 #5141
组件在更新性状时重置属性值(仅首次)
GrapesJS 版本 [X] 我确认使用最新版本 GrapesJS 你用的是什么浏览器? Chrome 版本 113.0.5672.63 可复制演示链接 https://jsfiddle.net/rajevar/zLs8q97f/4/ 描述一下那个虫子 这是针对本次讨论 ht...
问题 #6409
Cannot drag to move components on mobile
GrapesJS版本 [x] 我确认使用最新版本GrapesJS 你用的是什么浏览器? Chrome v133 可复制演示链接 https://jsfiddle.net/2hjdrb7L/1/ 描述一下那个虫子 如何复现这个漏洞? 使用grapesjs v0.22.x 初始化一...
与此问题匹配的付费插件
根据问题关键词和标签相关性精选,助你更快交付。
正在加载付费插件推荐……
相关教程
关于同一主题的深入指南。
教程
Introducing Search on GJS.Market
GJS.Market now has one search across everything we publish — plugins, articles, community questions, guides, authors and services. Press ⌘K from any page.
教程
如何在2026年用 GrapesJS 构建AI驱动的页面构建器
我们构建GJSDocs的经验——从简单的AI文本生成到结构化、上下文感知的视觉编辑
教程
2026年构建一个SaaS页面构建器需要多少钱?
2026年构建一个SaaS页面构建器的成本是多少?探索实际的开发成本、时间表、功能,以及使用 GrapesJS 如何降低成本
浏览插件分类
直接跳转到市场上的插件分类页面。