3

これは簡単な質問ですが、参考資料が見つからないので、ここで説明します。

select要素があると仮定します。

<select id="sel">
    <option value="1">1</option>
    <option value="2">2</option>
</select>

次に、選択したオプションを取得しますvalue。ほとんどの場合、この種のスニペットが使用されているのを目にします。

var sel = document.getElementById('sel');
console.log( sel.options[sel.selectedIndex].value ); //1

これはうまくいきます。selectただし、要素にもvalueプロパティがあることがわかりました。

console.log( sel.value ); //1

両方の例をいじくりまわしてください。

2番目の形式は、はるかに単純であるだけでなく、IE6までさかのぼって機能します（はい、実際にテストしました。これがIE6対応バージョンです）。

最初のアプローチがこれほど広く受け入れられている理由はありますか？2番目のアプローチとの非互換性またはコーナーケースの問題はありますか？

ps。私の「最もよく使われるアプローチ」の論文は、主に個人的な経験に基づいていましたが、参考までに、 JavaScriptを使用してドロップダウンリストで選択された値を取得するので最も賛成の2つの答えはありますか？最初のアプローチを使用します。

4

2 に答える 2

3

MDNページは私たちに教えてくれます

options nsIDOMHTMLOptionsCollection この要素に含まれる要素のセット。読み取り専用。

selectedIndex long 最初に選択された要素のインデックス。

value DOMStringこのフォームコントロールの値、つまり最初に選択されたオプションの値。

しかしそれはまた言う

selectedOptions 未実装（バグ596681を参照） HTMLCollection 選択されたオプションのセット。HTML5

したがって、複数選択で一般的な互換性が必要な場合は、ループオーバーするoptions必要がありますが、単一選択で同等である場合、前者はループの形式に「より類似」していますsel.options[sel.selectedIndex].value。sel.value複数選択が必要になります。

于 2013-03-27T14:33:18.603 に答える
1

最初のオプションは、よりよく知られているという理由だけで広く受け入れられています。2番目のオプションは完全に問題ありません。

ナビゲーター4で動作することを確認しましたか？

于 2013-03-27T15:21:21.820 に答える