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

发布于 2024-11-05 08:28:32 字数 672 浏览 0 评论 0原文

我有一小组结构化数据项，我想将其嵌入到 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>

这是一个拼凑，因为 div 元素的内容模型是流内容，它推荐至少一个后代。我也考虑过使用无序列表，但这也是出于同样原因的拼凑，因为 li 元素的内容模型也是流内容。

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

对于用于附加杂散数据属性的占位符元素还有其他建议吗？或者我对这一切都错了？使用像 JSON 这样的东西对于我的需求来说似乎很严厉......

原文

I have a small set of structured data items that I would like embedded in an HTML document. The data is used by some JavaScript for interacting with the page, but is otherwise hidden.

I have considered using HTML5 data attributes, but I am unsure which element is most suitable for affixing stray data. I thought of using div elements, like so:

<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>

This is a kludge, since the content model of the div element is flow content, which recommends at least one descendent. I also considered using an unordered list, but this is also a kludge for the same reason, since the content model of the li element is also flow content.

I have searched for best practices regarding HTML5 data attributes, but since these attributes are relatively new and not yet in common use, little information is available.

Any other recommendations for a placeholder element to which to affix stray data attributes? Or am I going about this all wrong? Using something like JSON seems heavy handed for my needs...

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

天暗了我发光 2024-11-12 08:28:32

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

这个要求不是硬性要求

，因此您可能会坚持归因 div 元素。如果您将带有 'display:none' 的唯一类 css-attributed 添加到您的虚拟元素，它们将不会被渲染，从而使流内容的复杂性变得毫无意义。
如果您对内容措辞感到更舒服（pc )，请改用空的 span 元素。

或者，meta-标签可能是一个选项：

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

请注意，meta-标签允许在 html5 文档的 body 中使用（元）。而 itemprop 属性 (ip) 对于用作通用数据容器是必要的，根据规范，content 属性并不是严格必要的 - 但是，您始终可以诉诸于一些虚拟属性细绳。

希望这有帮助，

最诚挚的问候，卡斯滕

i believe you tend to interpret the html5 spec too strictly. quoted from fc:

This requirement is not a hard requirement

so you might cling to attributing div elements. if you add a unique class css-attributed with 'display:none' to your dummy elements, they will not be rendered thus making the intricacies of flow content kind of moot.
if you feel more comfortable with phrasing content (pc), use empty span elements instead.

alternatively, the meta-tag might be an option:

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

note that meta-tags are allowed in the body of a html5 doc (meta). while the itemprop attribute (ip) is necessary for the use as a generic data container, according to the specs, a content attribute ist not strictly necessary - however, you could always resort to some dummy string.

hope this helps,

best regards, carsten

回复收藏 0 原文

~没有更多了~