for の小ネタと checkbox を同期させる tip の例です。
すみません。色々間違ってましたので改めて書き直しました。（同日追記）
ふと、さらに追記ｗ（10/03/29）
すみません。色々間違ってましたので改めて書き直しました。（同日追記）
ふと、さらに追記ｗ（10/03/29）
for で走査したいとき・・・。
elements = document.getElementsByTagName('DIV');
for(var i = 0, l = elements.length; i < l; i++) 処理・・・
なんてのが常道なのかな。
ちなみに l に length 入れるのは、その方が速いから。
そこで
elements = document.getElementsByTagName('DIV');
for(var l = elements.length; l--;) 処理・・・
こうするともっと速くなるし、変数も一つ減る。
で以降、実例です。
ちょっとした tip
ソース
function BoxSyncByName(o){
if(typeof(o) == 'string') o = document.getElementById(o);
if(o && o['for']) o = document.getElementById(o['for']);
if(!o || !o.name) return;
var els = o.form[o.name], flg = o.checked;
for(var e, i = els.length; i--;) if(
(e = els[i]) && e.type && e.type.toLowerCase() == 'checkbox'
) e.checked = flg;
}
function BoxSyncById(o){
if(typeof(o) == 'string') o = document.getElementById(o);
if(o && o['for']) o = document.getElementById(o['for']);
if(!o || !o.id.match(/^([a-z_\-]+)[0-9]+$/i) || !RegExp.$1) return;
var flg = o.checked,
reg = new RegExp("^" + RegExp.$1 + "[0-9]+$"),
els = document.getElementsByTagName('input');
for(var e, i = els.length; i--;) if(
(e = els[i]) && e.type && e.type.toLowerCase() == 'checkbox' &&
e.id && e.id.search(reg) === 0
) e.checked = flg;
}
if(typeof(o) == 'string') o = document.getElementById(o);
if(o && o['for']) o = document.getElementById(o['for']);
if(!o || !o.name) return;
var els = o.form[o.name], flg = o.checked;
for(var e, i = els.length; i--;) if(
(e = els[i]) && e.type && e.type.toLowerCase() == 'checkbox'
) e.checked = flg;
}
function BoxSyncById(o){
if(typeof(o) == 'string') o = document.getElementById(o);
if(o && o['for']) o = document.getElementById(o['for']);
if(!o || !o.id.match(/^([a-z_\-]+)[0-9]+$/i) || !RegExp.$1) return;
var flg = o.checked,
reg = new RegExp("^" + RegExp.$1 + "[0-9]+$"),
els = document.getElementsByTagName('input');
for(var e, i = els.length; i--;) if(
(e = els[i]) && e.type && e.type.toLowerCase() == 'checkbox' &&
e.id && e.id.search(reg) === 0
) e.checked = flg;
}
■ BoxSyncByName(o)
同じ name の checkbox を同期
o : checkbox element かその id
: またはその checkbox を指す label element。この場合は for より checkbox そ探す
■ BoxSyncById(o)
id の prefix が同じ checkbox を同期
o : checkbox element かその id
: またはその checkbox を指す label element。この場合は for より checkbox そ探す
■ 動作確認
ie:5.0, 5.5, 6, 7, 8
ff:1.0, 1.5, 2, 3
chrome:4
safari:4(win)
opera:8.53, 9.02, 10.10
sleipnir:2.3
netscape:7.1
opera7.02 label element の for 取得では動作しない
ie4, netscape6.2 動作しない
１０分程度で終わらすつもりが・・・。
間違いに気づいて書き直し、さらにその補填？お詫びｗ？で実例。
初期投稿１：３０。今、４：００！かよぉ。もう間違いないよなぁ・・・。
なんかボロボロすぎる。もう寝よう・・・。
間違いに気づいて書き直し、さらにその補填？お詫びｗ？で実例。
初期投稿１：３０。今、４：００！かよぉ。もう間違いないよなぁ・・・。
なんかボロボロすぎる。もう寝よう・・・。
ふと、さらに追記ｗ（10/03/29）
ソースの for の後 els[i] を e で置き換えたんだけど、どうせ e で置き換えるんなら以下の様にも。
for(var e, i = els.length; (e = els[--i]);) if(
e.type && e.type.toLowerCase() == 'checkbox'
) e.checked = flg;
e.type && e.type.toLowerCase() == 'checkbox'
) e.checked = flg;
ただ、これ for 内で置き換えてるので、(e = els[--i]) が最後の false 扱いの１回が余分になるのと、この場合は無いだろうけど els[i] が undefined になった時点で for が止まるので length 分総なめしたい時には不向きだよなぁ。
たかがこんだけのもんなのにあーだこーだ考えるのは、飲み込みが悪いからだろうなぁ・・・。
この記事へのコメント
Zakas’ JavaScript performance tips
http://james.padolsey.com/javascript/zakas-javascript-performance-tips/
私が書いた記事の手法。上のサイトでは「reverse loop」と書かれているね。
他にも色々パフォーマンスを上げる方法が書かれて、良い感じなのでコメに追記。