我一直在更现代的网站上看到这些属性,比如GitHub等等,它们似乎总是与title
属性的自定义弹出框一致。
<a href="/" data-value="hovering message">Option 1</a>
<a href="/" data-title="hovering message">Option 2</a>
<a href="/" data-original-title="hovering message">Option 3</a>
<a href="/" original-title="hovering message">Option 4</a>
我在HTML5 Doctor上阅读了一些关于数据属性的文档,我不太清楚这一点。
使用它们是否有一些SEO或辅助功能?什么是插件(希望jQuery)通常用于在这种特定情况下创建弹出窗口?
答案 0 :(得分:11)
简单地说,自定义数据属性的规范声明任何以“data-”开头的属性都将被视为私有数据的存储区域(在最终用户无法看到它的情况下是私有的 - 它没有'影响布局或演示)。
这允许您编写有效的HTML标记(传递HTML 5验证器),同时在页面中嵌入数据。一个简单的例子:
<li class="user" data-name="John Resig" data-city="Boston"
data-lang="js" data-food="Bacon">
<b>John says:</b> <span>Hello, how are you?</span>
</li>
发件人:Ejohn.org'不确定外部链接政策,只是把它放在这里以防万一有人想知道'
答案 1 :(得分:10)
HTML5 data-*
属性用于在元素
使用此属性进行操作时,您可以使用jQuery.data()或.data()方法。
答案 2 :(得分:7)
重点是data-
属性不会与以后可能添加到HTML或使用特定于浏览器的属性的属性冲突。我们的想法是给作者一个游乐场,一个名称空间,他可以将属性用于私人目的,而不必担心它们被解释为标准或供应商定义的属性,具有某种不同的含义。
根据这个想法,搜索引擎和辅助软件忽略了这些属性,因为它们没有可互操作的含义。