首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >空的HTML5数据属性是否有效?

空的HTML5数据属性是否有效?
EN

Stack Overflow用户
提问于 2018-04-02 07:21:04
回答 2查看 0关注 0票数 0

我想编写一个简单的jQuery插件,在指定元素下显示内联模式。我的想法是让脚本根据元素上指定的数据属性进行自动初始化。

一个非常基本的例子:

代码语言:javascript
复制
<p data-modal-target>Hover over me for an inline modal!</p>
<div data-modal-content data-modal-align="right" data-modal-trigger="hover" data-modal-offset="10px"><!-- any desired syntax can go here --></div>

我只是想知道data-modal-target在上面的例子中是否有效,还是必须是data-modal-target="true"?我唯一的要求是它是有效的HTML5。

EN

回答 2

Stack Overflow用户

发布于 2018-04-02 15:31:43

是的,有效。data-modal-target将代表一个布尔属性:

布尔属性 元素上布尔属性的存在表示真值,缺少属性表示假值。

票数 0
EN

Stack Overflow用户

发布于 2018-04-02 16:58:46

自定义数据属性规范没有提及对空属性处理的任何更改,因此有关空属性的一般规则适用于此处:

某些属性可以通过仅提供属性名称来指定,而没有值。 在以下示例中,该disabled属性是使用空属性语法给出的: <input disabled> 请注意,空属性语法与将空字符串指定为属性的值完全等效,如下例所示。 <input disabled="">

因此,可以使用空的自定义数据属性,但需要进行特殊处理以将其用作布尔值。

如果通过element.dataset以下方式访问属性:

  • 当存在空属性时,它的值是""
  • 当一个属性不存在时,你会得到undefined

因此,不能只是检查,if (element.dataset.myattr)因为它永远是false

可以也应该检查布尔属性if (element.dataset.myattr !== undefined)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/-100003766

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档