非附属HTML5数据属性的占位符元素?

时间:2011-05-03 22:42:56

标签: html5 custom-data-attribute

我想在HTML文档中嵌入一小组结构化数据项。某些JavaScript使用这些数据与页面进行交互,但隐藏了这些数据。

我考虑过使用HTML5数据属性,但我不确定哪个元素最适合粘贴杂散数据。我想过使用div元素,如下所示:

<div data-make="Ford"  data-model="Fusion"  data-year="2005"></div>
<div data-make="Chevy" data-model="Volt"    data-year="2010"></div>
<div data-make="Honda" data-model="Insight" data-year="2010"></div>

这是一个kludge,因为div元素的内容模型是流内容,它推荐至少一个后代。我还考虑使用无序列表,但由于li元素的内容模型也是流内容,因此这也是一个因素,因为{{1}}元素的内容模型也是流内容。

我搜索过有关HTML5数据属性的最佳做法,但由于这些属性相对较新且尚未普遍使用,因此可用的信息很少。

对于要附加杂散数据属性的占位符元素的任何其他建议?或者我这样做是错的?使用像JSON这样的东西似乎很难满足我的需求......

1 个答案:

答案 0 :(得分:1)

我相信你倾向于过于严格地解释html5规范。引自fc

  

此要求不是硬性要求

所以你可能会坚持归因div元素。如果你向你的虚拟元素添加一个与'display:none'一起归属的唯一类css,它们将不会被渲染,从而使得流内容的复杂性变得没有实际意义。 如果您对短语内容(pc)感觉更舒服,请改用空span元素。

或者,meta - 标签可能是一个选项:

<meta itemprop="data" content="dummy" data="..."/>

请注意,html5 doc(meta)的meta中允许使用body - 标记。虽然itemprop属性(ip)是用作通用数据容器所必需的,但根据规范,content属性并非绝对必要 - 但是,您总是可以诉诸一些虚拟字符串。

希望这有帮助,

最好的问候,carsten