在JavaScript的HTML标记中存储任意信息？

Question

一个非常普遍的问题。

我正在使用HTML / JavaScript动态生成一个分为多个标签级别的表单。

我想使用CSS和背景图片突出显示某些字段（值与全局模板不同的字段）和星号*符号。

JS字段遍历每个字段，比较其值，并在必要时为其设置CSS类。到目前为止，非常好。

现在另外，我不仅希望每个更改的字段都标有星号，还要标记它所在的标签。

因为我喜欢它简单，我想将选项卡的元素ID存储为每个字段的HTML标记中的某个属性（类似于“parentTab”）。 JS函数然后突出显示该字段及其“parentTab”字段。元素（也许那个人的“parentTab”也是如此）。

我的第一种方法是滥用“标题”。属性或somethiong来存储parentTab。当然，这很脏。但是，如果我只是将任意属性添加到DIV或INPUT标签中，它将不再进行验证，我觉得访问这些属性的安全性不足 - 谁知道不同的浏览器如何处理它，并且将来会处理它？ / p>

所以我的问题是：是否有一种有效的，符合标准的方式 - 某种属性 - 在HTML标签中存储任意数据，以便通过JavaScript进一步处理？

当然，我可以创建一个“parentTabs”。 JS数组并完成它。但是将它存储在输入本身会更加优雅。

Answer 1

您可以通过编写isChildOf函数找出字段所属的选项卡元素，如下所示： http://jimkeller.blogspot.com/2008/07/jquery-ischildof-is-element-child-of.html

使用DOM来解决这个问题总是会更加“优雅”。而不是以某种自定义格式复制数据。

Answer 2

通过引入html5，您可以使用以数据开头的属性 - ，他们仍然会验证。

<input type="text" name="username" data-parentTab="tab1" value="non-default">

Answer 3

rel 属性通常是存储这类数据的有效选择。

Answer 4

在jQuery中你有这个问题的数据API。 http://docs.jquery.com/Internals/jQuery.data

如果您不使用jQuery，您可以添加自己的标签并在其中存储任何内容。 每个人都会告诉你这不是很好，但所有伟大的网络公司都在这样做。所以你最终会成为一家伟大的公司; - ）

Answer 5

我喜欢 John Resig 这样做：一个任意类型的脚本标签。他的例子是关于模板化的，但你可以将它用于任何事情。