new Option

nameがsctのselectのリストをJavaScriptを使って増やす時

<select name=sct></select>


optionのtextをtest0〜test10に、valueをa0〜a10に、ついでに背景色を緑にする場合
今まではこのような感じで増やしていた。
この方法は、MicroSoftが配布していたHtaApplicationのヘルプみたいなものに
記述されていた方法で、実際はVBScriptで書かれていたのをJScriptにして使っていた。
だから、もしかしたらIEだけにしか使えないかもしれない。

for (var i = 0; i <= 10; i ++) {
	var ne = document.createElement("option");
		ne.text = "test" + i;
		ne.value = "a" + i;
		ne.style.backgroundColor = "#00ff00";
	sct.add(ne);
}


こちらは最近見掛けた翻訳Apiを使って何かするスクリプト
new Optionというのが使われていた。
new Optionの括弧内は(text, value)のようだ。

for (var i = 0; i <= 10; i ++) {
	sct.options[i] = new Option("test" + i, "a" + i);
	sct.options[i].style.backgroundColor = "#00ff00";
}

こっちの方がスマートなので、これからはこちらを使うようにする。




追記
スタイルシートの変更で新たな技を覚えた。
例えば、背景と文字色を変更する場合

var aa = {background: "#00ff00", color: "#ffff00"};

for (var c in aa) {
    sct.options[i].style[c] = aa[c];
}

このように配列にして出来るみたい、つか出来た。


しかし

sct.options[i].style.c

これはだめで


このような記述はOKだった

sct.options[i].style["background"]