2

スクリプト 1はログに記録されますが、ブラウザーは引き続き要素をOnetwoとしてレンダリングします。フォームは値も送信します。スクリプト 2は、ログを記録し、レンダリングし、送信します。私はそれらが同義語であり、同じことをすることを期待しています。それらが異なる理由と、同じ矛盾に注意する必要がある他の場所を説明してください.selectonetwo

私が理解しているように、DOM の要素は実際には属性selectを保持していません。value最初のメソッドは、それを明確に割り当て、その要素から値を取得します。レンダリングには影響しません。要素の場合、どのように正しく使用すればよいですsetAttributeかgetAttribute?select

デモ ドキュメント:

<select id="el">
  <option value="one">One</option>
  <option value="two">Two</option>
</select>

スクリプト 1:

document.getElementById('el').setAttribute('value','two');
console.log(document.getElementById('el').getAttribute('value'));

スクリプト 2:

document.getElementById('el').value = 'two';
console.log(document.getElementById('el').value);
4

3 に答える 3

4

MDN は のvalue属性について言及していません。おそらく、 のselected属性<select>を意味していたのでしょう。value属性は、 、 などの他のフォーム関連要素に適用されます。<option><input><textarea>

それでも、selected属性には、他の要素のvalue属性と同じことが当てはまります。現在の値は変更されませんが、のデフォルト/初期値のみが変更されます<select>。いつ.resetでも親<form>に適用させることができます (ただし、これにより、フォームに関連付けられた他のすべての要素もリセットされます)。例えば;

<!-- HTML -->
<form id="f">
    <select id="el">
        <option value="one">One</option>
        <option value="two">Two</option>
    </select>
</form>

ここで、 JavaScriptを使用して、選択した属性を に設定し<option>、次に;に設定resetします。<form>

document.getElementById('el').options[1].setAttribute('selected','selected');
document.getElementById('f').reset(); // make it get applied by resetting form

デモフィドル

HTMLSelectElement DOM インターフェイスにはプロパティvalueがあり、これは次のように定義されます。

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

したがって、それを ( に) 設定すると、 に一致する値xを持つ最初のオプションを探して利用可能なオプションをループし、(見つかった場合) それを「最初に選択したオプション」として選択し、現在の選択を変更します。x

于 2013-05-04T00:44:04.583 に答える
3

属性とプロパティには違いがあります。

要素が最初に解析されると、HTML コードの値から属性が取り込まれます。これらの値は、対応する名前でプロパティにコピーされます。したがって、属性には初期値が含まれ、プロパティには現在の値が含まれます。

属性を変更すると、要素が初期値と見なすものは変更されますが、現在の値は変更されません。

于 2013-05-04T00:36:33.447 に答える
1

value属性は要素の初期値を定義するため、value プロパティは実際の値です。

要素が作成された後は、ほとんど何もしないため、value 属性を設定しても意味がありません。

于 2013-05-04T00:34:46.737 に答える