HTML标签上的非标准属性。 好东西？ 坏事？ 你的想法？
对于标签上的非标准属性，HTML（或者也许只是XHTML？）是相对严格的。 如果它们不是规范的一部分，那么你的代码被认为是不合规的。
然而，非标准属性对于将元数据传递给Javascript是相当有用的。 例如，如果链接假设显示一个popup窗口，则可以在一个属性中设置popup窗口的名称：
<a href="#null" class="popup" title="See the Popup!" popup_title="Title for My Popup">click me</a> 或者，您可以将popup窗口的标题存储在一个隐藏元素中，如跨度：
<style> .popup .title { display: none; } </style> <a href="#null" title="See the Popup!" class="popup"> click me <span class="title">Title for My Popup</span> </a>
然而，我很茫然地想知道哪一个应该是一个首选的方法。 第一种方法更简洁，而且我猜测，它不会像search引擎和屏幕阅读器那样紧张。 相反，第二个选项使得存储大量数据变得更容易，因此更通用。 它也符合标准。
我很好奇这个社区的想法是什么。 你如何处理这样的情况？ 第一种方法的简单性是否超过潜在的缺点（如果有的话）？
我是build议的HTML 5解决scheme（ data-前缀属性）的忠实粉丝。 编辑：我会补充说，有可能更好的例子使用自定义属性。 例如，自定义应用程序将使用的数据在标准属性中没有模拟（例如，基于不能用className或id表示的事件处理程序的定制）。
自定义属性提供了一种方便的方式将额外的数据传送到客户端。 Dojo Toolkit正在经常这样做，并且已经指出（ 揭穿Dojo工具包神话 ）：
自定义属性一直是有效的HTML，它们只是在对DTD进行testing时不validation。 HTML规范指出，任何未被识别的属性都将被用户代理中的HTML呈现引擎忽略，并且Dojo可以select利用这一点来提高开发的便利性。
另一个select是在Javascript中定义这样的东西：
<script type="text/javascript"> var link_titles = {link1: "Title 1", link2: "Title 2"}; </script>
然后，你可以稍后在你的Javascript代码中使用它，假设你的链接有一个与这个散列表中的ID相对应的ID。
它没有其他两个方法的缺点：没有非标准属性，也没有隐藏的难看的跨度。
缺点是它可能会像你的例子一样简单的矫枉过正。 但是对于更复杂的情况，如果有更多的数据可以通过，这是一个不错的select。 特别是考虑到数据是以JSON的forms传递的，所以你可以轻松地传递复杂的对象。
此外，您将数据与格式保持分开，这对于可维护性来说是一件好事。
你甚至可以有这样的事情（你不能用其他方法）：
var poi_types = {1: "City", 2: "Restaurant"}; var poi = {1: {lat: X, lng: Y, name: "Beijing", type: 1}, 2: {lat: A, lng: B, name: "Hatsune", type: 2}};
…
<a id="poi-2" href="/poi/2/">Hatsune</a>
而且由于你很可能使用了一些服务器端编程语言，这个哈希表应该是微不足道的dynamic生成（只是将其序列化为JSON，并吐在页面的标题部分）。
那么在这种情况下，最佳的解决scheme是
<a href="#" alt="" title="Title of My Pop-up">click</a>
并使用title属性。
有时如果我真的需要的话，我会破坏这个规范。 但很less，只有很好的理由。
编辑：不知道为什么-1，但我指出，有时你认为你需要打破规范，当你不这样做。
为什么不在自定义DTD中声明popup_title属性？ 这解决了validation的问题。 我用每一个非标准的元素，属性和值来做这件事，并且感谢这个validation，显示出我的代码只有真正的问题。 这也使得这种HTML的浏览器错误更less。
你可以将隐藏的input元素嵌套在anchor元素中
<a id="anchor_id"> <input type="hidden" class="articleid" value="5"> Link text here </a>
那么你可以很容易地把数据拉出来
$('#anchor_id .articleid').val()
我的解决scheme最后是隐藏附加数据的id标签分隔的某种分隔符（一个下划线是一个空格，二是该arg的结束），第二个arg有一个id：
<a href="#" class="article" id="Title_of_My_Pop-up__47">click</a>
丑陋的，它假定你还没有使用ID标签的东西，但它是符合所有浏览器。
在我的例子中，我个人的感觉是跨度路由更合适，因为它符合XHTML规范的标准。 但是，我可以看到自定义属性的区段，但我认为它们会增加一些不必要的混淆。
我一直在为这个问题而绞尽脑汁。 我喜欢非标准属性的可读性，但我不喜欢它会打破标准。 隐藏的跨度示例是兼容的，但是不太可读。 那这个呢：
<a href="#" alt="" title="" rel="{popup_title:'Title of My Pop-up'}">click</a>
这里的代码是非常可读的，因为JSON的键/值对符号。 你可以通过查看它来知道这是属于链接的元数据。 除了劫持“rel”属性之外，我能看到的唯一缺陷是对于复杂的对象来说这会变得麻烦。 我非常喜欢上面提到的“数据”前缀属性的想法。 目前的浏览器支持吗？
这是别的想法。 不合规的代码对SEO有多大的影响？
