为什么前端框架可以创建自定义属性，但我希望在我的前面添加“data-”

Question

为什么前端框架能够在 html 元素上创建自定义属性，例如

以 Vue 为例

<div v-for="...">

如果我自己编写，Html 验证器会抱怨。

<div something>

告诉我我应该像这样假装数据

<div data-something>

我了解一致性和标准的重要性。但我很好奇前端框架是否在幕后做一些特殊的事情来规避这个规则。

或者他们只是忽略了它？

Answer 1

关于Vue：

您为 Vue 提供的 HTML 不是渲染的 HTML。它由 Vue 编译成创建虚拟 DOM 的 JS 代码。然后，Vue 默认渲染器将其转换为实际的“正确”HTML，而无需

v-for

和其他指令。

如果您想验证 HTML - 验证呈现的 HTML 页面。

Vue 模板是伪 HTML，有助于为虚拟 DOM 创建渲染功能，从而提高可读性并让设计师等非程序员参与其中。

我想其他框架也是如此 - 您应该验证最终渲染的 HTML。