jQuery1.3.2 リリース
2009年2月20日に、jQuery1.3.2がリリースされました。
ほとんどはバグフィックスですが、以下のような変更も加えられています。
セレクター指定による取得要素の順番がドキュメントの順に
今までは複数の要素を返す場合、セレクター書式で指定した順番になっていました。 それが、実際にDOMツリー上に出てくる順番で返すように変更になっています。これは、W3Cで策定されているSelectors APIのドラフトで定義された内容に沿ったものです。
たとえば以下のような指定をした場合、
$("h1, h2, h3")jQuery 1.3.1以前であれば、この指定された順に従って要素を返していました。
=> [h1, h1, h2, h2, h3, h3]しかしjQuery 1.3.2からは、実際にページ上で定義されている順番に沿って返します。
=> [h1, h2, h3, h3, h1, h2]
.live()でバブリングを止められる
jQuery 1.3から追加された.live()で指定したコールバック関数内で、バブリングを止められるようになりました。通常のイベント同様に、event.stopPropagation()や戻り値にfalseを返すことで、イベント伝播を停止させることができます。 これにより、たとえば下記のような例では、文字をクリックしても外側のliに定義したイベントはキックされないようになります。
<ul> <li><b>Google</b></li> <li><b>Yahoo</b></li> </ul> <script> $("li").live("click", function(){ $(this).addClass("active"); }); $("li b").live("click", function(){ $(this).addClass("active"); return false; }); </script>また、現時点で.live()でサポートされていない機能(submitやchangeなどのイベント対応)については、おそらく来月にも公開されるであろうjQuery 1.3.3で対応される予定が併記されています。
:visible/:hidden処理の変更
セレクター書式での:visibleおよび:hiddenの検出ロジックが、以下のように変わりました。jQuery1.3.1以前
要素のCSSを見て、"display"が"none"ではなく、"visibility"が"hidden"ではなく、input要素であればtype属性が"hidden"でないこと
jQuery1.3.2以降
ブラウザがoffsetWidthおよびoffsetHeightにゼロより大きい値を返すこと
この変更により、対象要素のdisplayが"none"の場合はもちろん、親要素のdisplayが"none"であったり、要素のwidthやheightがゼロであった場合なども、":hidden"として検出されるようになりました。
このことで、次のような利点が得られます。
.height()/.width()処理の変更
.height()、.width()、.innerHeight()、.innerWidth()、.outerHeight()、.outerWidth()が、全てのブラウザ上で劇的にパフォーマンスを上げました。(参考)Internet Explorer上でのセレクター処理速度向上
セレクターエンジンがjQuery1.3よりSizzleに変わり、コミュニティから多くの協力を得て、特にInternet Explorer上でのパフォーマンスが大きく向上しました。(参考)また、単体ライブラリとしてのSizzleドキュメントが出来ました。
興味があれば参考にしてください。
.appendTo()などが、新たに追加された要素を返すように
バグ修正の一環になりますが、appendTo、prependTo、insertBefore、insertAfter、replaceAllが、元の要素を返してしまっていたのを、新たに挿入された要素を返すように修正しました。何がおきたのかを理解するために、以下のサンプルを見て下さい。
<div></div> <div></div> <script> $("<p/>") .appendTo("div") .addClass("test"); </script>jQuery1.3.1以前では、このようなコードを記述した場合に、次のような結果となっていました。
<div><p class="test"></p></div> <div><p></p></div>これはつまり、appendToが新規に作られたp要素そのものを返してしまい、実際にDOMツリーに挿入された要素を返していなかったことに起因します。
jQuery1.3.2からは、次のような結果を得られます。
<div><p class="test"></p></div> <div><p class="test"></p></div>これが、期待された結果だと思います。
前述の関数は全て、jQuery stackに新たに追加された要素を貯めるようになりました。これにより、.end()によるスタック操作も出来るようになっています。
jQuery開発チームの調査によると、この変更によって悪影響を受けるようなコードは発見できなかったということです。
自身のコードでも、以前の動作を期待して書いたことは無いので、問題ないかと思います。
このようなDOM操作系関数を多用している人は、注意して下さい。