jQueryセレクタ selectedの取得と実行速度
select selectedの値の取得、処理速度からの最適化
10000回繰り返し、処理時間の計測。
jQuery
// 開始
console.time("$('option:selected', this)");
// 10000回実行
for(var i = 0; i < 10000; i++){
// 処理
var element = $('option:selected', this);
}
// 値
console.log(element.val());
// 終了
console.timeEnd("$('option:selected', this)");
選択されている値を取得する。
サンプル
| セレクタ | 実行速度（10回平均） |
|---|---|
| $(this).children(':selected') | 68.723ms |
| $(this).children('option:selected') | 82.966ms |
| $('option:selected') | 202.638ms |
| $('#fruits :selected') | 225.628ms |
| $(this).find(':selected') | 246.597ms |
| $('#fruits option:selected') | 253.76ms |
| $('[name=fruits] option:selected') | 256.347ms |
| $(this).find('option:selected') | 263.084ms |
| $('select[name=fruits] option:selected') | 272.134ms |
| $(':selected', this) | 288.376ms |
| $('option:selected', this) | 307.609ms |
| $(':selected') | 657.791ms |
| $('[name=fruits] :selected') | 732.522ms |
| $('select[name=fruits] :selected') | 749.835ms |
指定された値が選択されているか判定する。
サンプル
| セレクタ | 実行速度（10回平均） |
|---|---|
| $('option[value=apple]') | 75.457ms |
| $('[name=fruits] option[value=apple]') | 76.758ms |
| $('select[name=fruits] option[value=apple]') | 77.204ms |
| $('[value=apple]') | 77.76ms |
| $('select option[value=apple]') | 78.402ms |
| $('select[name=fruits] [value=apple]') | 79.634ms |
| $('select [value=apple]') | 79.72ms |
| $('[name=fruits] [value=apple]') | 80.219ms |
| $('#fruits [value=apple]') | 80.65ms |
| $('#fruits option[value=apple]') | 94.349ms |
結果一覧はphp.o0o0.jp-jQuery selectorsを参照。
