问题
I want to use a custom boolean attribute to mark an element's contents as editable. I'm aware of the data-* attributes, but wasn't sure if they require a value. I don't need data-is_editable="false", as the lack of the attribute would be equivalent. I only care if it's "true" (if the attribute exists). I know I can use other attributes like class but I don't want to as it seems slightly inappropriate (correct me if I'm wrong about that).
Here's the resource I'm reading, maybe it's the wrong document or I've overlooked the information I'm looking for: http://www.w3.org/html/wg/drafts/html/master/dom.html#custom-data-attribute
So for example, is this legal and valid?
<div data-editable data-draggable> My content </div>
回答1:
The example you show is valid. (Just like using disabled or checked in a form. Only xHTML force the presence of a value)
Although, the value returned is not a boolean. When you query this resource, you'll get an empty string for any empty data-* attributes.
Like so:
domNode.dataset.draggable; // log ""
domNode.dataset.notAdded; // log null
So, you just have to check it:
var isDraggable = (domNode.dataset.draggable != null)
Edit
Stupid to haven't tell it before. But, you can just check if the attribute exist if you want a boolean:
domNode.hasAttribute("data-draggable");
回答2:
It passes the W3.org validator, which is a good sign.
Javascript's dataset and jQuery's data functions seem to know the difference between the attribute there or missing - but the value is an empty string when it's there, and either undefined or null when it's not. To avoid confusion, I don't think I'd use that personally - I'd probably instead opt for <div data-editable="1"></div> instead.
来源：https://stackoverflow.com/questions/16864999/can-i-use-html5-data-attributes-as-boolean-attributes