web-dev-qa-db-ja.com

HTML5 data- *属性をブール属性として使用できますか?

カスタムブール属性を使用して、要素のコンテンツを編集可能としてマークしたいと思います。 data-*属性は知っていますが、値が必要かどうかはわかりませんでした。属性の欠如は同等であるため、data-is_editable="false"は必要ありません。私はそれが「真」であるかどうかだけを気にします(属性が存在する場合)。 classのような他の属性を使用できることは知っていますが、少し不適切に見えるので使用したくありません(間違っている場合は修正してください)。

これが私が読んでいるリソースです、多分それは間違った文書であるか、私が探している情報を見落としています: http://www.w3.org/html/wg/drafts/html/master/ dom.html#custom-data-attribute

たとえば、これは合法で有効ですか?

<div data-editable data-draggable> My content </div>
21
Wesley Murch

あなたが示す例は有効です。 (フォームでdisabledまたはcheckedを使用するのと同じです。値の存在を強制するのはxHTMLのみです)

ただし、返される値はブール値ではありません。このリソースをクエリすると、空のdata-*属性の空の文字列が取得されます。

そのようです:

 domNode.dataset.draggable; // log ""
 domNode.dataset.notAdded; // log null

だから、あなたはそれをチェックする必要があります:

var isDraggable = (domNode.dataset.draggable != null)

編集

前にそれを言わなかったのは愚かです。ただし、ブール値が必要な場合は、属性が存在するかどうかを確認できます。

domNode.hasAttribute("data-draggable");
15
Simon Boudrias

W3.orgバリデーター を渡します。これは良い兆候です。

Javascriptのdataset関数とjQueryのdata関数は、属性が存在するか欠落しているかの違いを認識しているようですが、値は存在する場合は空の文字列であり、存在しない場合は未定義またはnullです。混乱を避けるために、私はそれを個人的に使用するとは思いません-代わりに<div data-editable="1"></div>を選択するでしょう。

4
Joe Enos