2012-05-18 20 views
30

以下の2つの用途の違いは何ですか?私にとってchecked = "checked" vs checked = true

document.getElementById('myRadio').checked = "checked"; 

document.getElementById('myRadio').checked = true; 

、両方が同じように動作しています。しかし、私は同じことをする2つの方法がなぜ存在するのか不思議です。

どちらが理想的な使用法ですか?私はIE7以上のバージョンをサポートする必要があります。

答えて

40

document.getElementById('myRadio').checkedブール値です。 trueまたはfalse

document.getElementById('myRadio').checked = "checked";は、真偽値にストリングをキャストする必要があります。

document.getElementById('myRadio').checked = true;は、キャストなしでtrueを割り当てるだけです。

trueを使用すると、わずかに効率が良く、メンテナーに明らかにする意図があります。

7

元のchecked属性(HTML 4以前)は値を必要としませんでした。存在していれば要素は「チェック」されていない場合は要素がチェックされていませんでした。

これは、しかしHTML 4.

標準に従っXHTMLには有効ではありませんが、真の条件としてchecked="checked"を使用することが提案されている - あなたが同じことをやって終わる掲載ので、両方の方法を。

あなたがどちらを使うのが本当に問題ではありません - あなたに最も合っているものを使い、それに固執する(またはあなたのチームに行くことに同意します)。

+5

番号を以前のそれは* *値を必要としなかった...それはオプションだった名前でした。 'checked =" checked "はフルバージョンですが、' checked = "'と '' 'offのままにしておくことができます。 (SGMLは*奇妙な*を得ることができます!) – Quentin

+3

しかし、HTMLの規則ではなくDOMのプロパティについての質問があります。 – Quentin

+0

@Quentin - それは意味論についてのほとんど議論ですが、十分に公正です。 – Oded

2

checked属性はブールfalse以外の"string"のよう"checked"値がtrueに変換するブール値です。

任意の文字列値がtrueになります。

JSを使用してDOMでブール値を変更することのみを解除することができます。

したがって答えは:それらは等しいです。

w3c

+2

JavaScriptのDOMプロパティをHTML属性と混同しています(ブラウザのエラー回復にうんざりしています)。 – Quentin

6

document.getElementById('myRadio')はDOM要素を返します。この回答ではelemと言います。

elem.checkedプロパティ DOMエレメントのcheckedにアクセスします。このプロパティは常にブール値です。

HTMLを書くときはXHTMLでchecked="checked"を使用します。 HTMLでは単にcheckedを使うだけです。属性を設定する場合(これは.setAttribute('checked', 'checked')によって行われます)、一部のブラウザは空の値が存在しないとみなすため、値を指定する必要があります。

DOM要素があるので、属性を設定する必要はありません。単純に、より快適なブール値プロパティを使用できるからです。ブール値のコンテキストでは空でない文字列がtrueと見なされるので、elem.checked'checked'またはそれ以外の値('false'または'0')を設定すると、チェックボックスがオンになります。しかし、適切な値に固執する必要があるので、truefalseを使用しない理由はありません。

5

要素には、属性とプロパティの両方があります。名前はcheckedです。このプロパティは、現在の状態を決定します。

属性は文字列で、プロパティはブール値です。要素がHTMLコードから作成されると、マークアップから属性が設定され、属性の値に応じてプロパティが設定されます。

マークアップ内の属性の値がない場合、属性はnullなるが、プロパティは常にtruefalseのいずれかであるので、それはfalseになります。

あなたがプロパティを設定するときは、ブール値を使用する必要があります属性を設定することも変更すること

document.getElementById('myRadio').setAttribute('checked', 'checked'); 

注:属性を設定した場合

document.getElementById('myRadio').checked = true; 

、あなたは文字列を使用プロパティを設定しても属性は変更されません。

属性を設定する値が何であれ、プロパティはtrueになります。空の文字列またはnullを使用しても、属性を設定すると、チェックされていることを意味します。属性を使用して要素をオフにremoveAttributeを使用します。HTML 4では

document.getElementById('myRadio').removeAttribute('checked'); 
+0

プロパティと属性の間の良い説明。ありがとう! – Mac

関連する問題