Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.mozilla.org/ja/docs/Web/API/HTMLOptionElement/Option below:

HTMLOptionElement: Option() コンストラクター - Web API

Baseline Widely available

Option() コンストラクターは、新しい HTMLOptionElement を生成します。

new Option()
new Option(text)
new Option(text, value)
new Option(text, value, defaultSelected)
new Option(text, value, defaultSelected, selected)

text 省略可

文字列で、要素の内容、すなわち表示するテキストを表します。これが指定されていない場合は、 ""（空文字列）が既定値として使用されます。

value 省略可

文字列で、この HTMLOptionElement の値、すなわち対応する <option> 要素の value 属性を表します。指定されなかった場合は text の値が value として、例えば、フォームがサーバーへ送信されるときには <select> 要素の値として使用されます。

defaultSelected 省略可

true または false のどちらかの値で、selected 属性の値を設定するものです。すなわち、ページが最初に読み込まれたときに、この <option> が <select> 要素で選択される既定値になるようにします。これが指定されていない場合は、既定値の false が使用されます。なお、 true を指定しても、その選択肢が selected でない場合は選択状態にはなりません。

selected 省略可

true または false のどちらかの値で、その選択肢の選択状態を設定します。既定値は false（未選択）です。省略された場合、defaultSelected 引数が true であっても、その選択肢は選択されません。

/* 以下の HTML があるとする
<select id='s'>

</select>
*/

const s = document.getElementById("s");
const options = [Four, Five, Six];

options.forEach((element, key) => {
  s[key] = new Option(element, key);
});

/* 以下の HTML があると想定する
<select id="s">
    <option>First</option>
    <option>Second</option>
    <option>Third</option>
</select>
*/

const s = document.getElementById("s");
const options = ["zero", "one", "two"];

options.forEach((element, key) => {
  if (element === "zero") {
    s[key] = new Option(element, s.options.length, false, false);
  }
  if (element === "one") {
    s[key] = new Option(element, s.options.length, true, false); // "selected" 属性を追加
  }
  if (element === "two") {
    s[key] = new Option(element, s.options.length, false, true); // "view" の中で選択状態になる
  }
});

/* 結果
<select id="s">
  <option value="0">zero</option>
  <option value="1" selected="">one</option>
  <option value="2">two</option> // ユーザーにはこれが 'selected' に見える
</select>
*/

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4