jquery - 隐藏输入与 HTML5 数据属性

Question

最近一直困扰我的是 HTML5 data attributes 的使用什么时候适合使用它们。

通常，在对我的服务器执行大量 AJAX 调用的页面上，我需要 ID这是正在查看的页面的代表。我目前一直将其存储在一个隐藏的 <input> 中页面上的元素，然后访问该元素并将其存储在我的 jQuery 文档就绪调用顶部的 JS 变量中。

我一直在考虑将其移至 data-id body 元素上的属性，然后我将使用 $('body').data('id'); 在 jQuery 中访问它.

使用 HTML5 数据属性是否有任何优势，反之亦然？表现？安全？ “最佳实践”？

据我所知，所有浏览器都可以访问数据属性，因此处理 IE 不是问题。

Answer 1

主要缺点之一是可访问性。

由于这些属性不会在 POST 中提交给服务器，因此您需要记住在禁用 JavaScript 的浏览器中会发生什么。如果您的页面还应该能够正常降级并在必要时通过传统表单提交执行那些相同的 AJAX 请求功能，则仍然需要一个隐藏字段。

也就是说，当数据属性有意义时，我非常喜欢它们，尤其是在可以安全地强制使用 JavaScript 的严格“应用程序”类型的站点中。例如，使用 data-id 属性标记表行比在其中一个单元格中填充隐藏字段要好得多。特别是结合 jQuery 对 .data() 方法的良好数据属性支持，在隐藏字段可能有点困惑的情况下，可以生成干净、直观的代码。