jQueryのバージョンを上げる時に出くわしたのでメモを残します。
目次
環境
- 対象のjQuery
- 1.5.2
- 1.6.0
現象
jQueryの attr()
を使って属性の値を取得しているコードのうち、
<p>Hello World</p> <script> // class属性がないのに attr() を使っている result = $('p').attr('class'); </script>
と、属性が定義されていない場合、後続の処理で予期しない挙動をしていました*1。
原因
jQuery1.6.0より、 attr()
の戻り値が変わっていました。
属性が定義されていない場合の attr()
の戻り値が
- 〜1.5.2:空文字
- 1.6.0〜:undefined
へと変わっていました。
公式ドキュメントの attr()
でも undefined
が返ってくるとの記載がありました。
.attr() | jQuery API Documentation
これより、元のソースコードは空文字が返ってくると想定していたようなので、undefinedが返ってきて想定外の挙動になったようでした。
jQuery1.6〜では、 attr()
と prop()
に関する変更も入っているので、合わせてこのあたりも修正されたのでしょうか。
jqueryのattrとprop(とdataとvalとhtmlとかつまり属性とかの取得)の使い分け一覧 - Qiita
実験
ためしに
result = $('p').attr('class'); console.log(result); console.log(typeof result);
を試してみたところ、以下の結果となりました。
jQuery1.5.2
jQuery1.6.0
ソースコード
GitHubに上げました。 attr_undefined
ディレクトリの中が今回のファイルです。
https://github.com/thinkAmi-sandbox/jQuery-misc
*1:クラス名をattr()で取得するのが良いのかは、ここでは置いておきます