jQuery1.6.0より、属性がない時のattr()の戻り値が、空文字からundefinedへと変更されていた

jQueryのバージョンを上げる時に出くわしたのでメモを残します。

 
目次

 

環境

 

現象

jQueryattr() を使って属性の値を取得しているコードのうち、

<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

f:id:thinkAmi:20180703123106p:plain

 
jQuery1.6.0

f:id:thinkAmi:20180703123123p:plain

 

ソースコード

GitHubに上げました。 attr_undefined ディレクトリの中が今回のファイルです。
https://github.com/thinkAmi-sandbox/jQuery-misc

*1:クラス名をattr()で取得するのが良いのかは、ここでは置いておきます