$.hasData

要素に紐付いたデータを持っているかどうかを調べます。

$.hasData( element ) 1.5追加

戻り値:Boolean

対象の要素にデータが紐付けられているかどうかを調べます。

引数 説明
element データが紐付けられているかどうか調べたい要素を指定します。 (※jQueryオブジェクトの指定では、正常に機能しません。)

$.hasData()メソッドは、$.data()によって設定された何らかの値を、指定した要素が現在持っているかを調べます。 もし、要素にデータに関連付けられたデータが何も無ければ(全くデータオブジェクトが無い、またはデータオブジェクトが空)、 メソッドはfalseを返します。そうでなければ、trueを返します。

$.hasData(element)の主な利点は、要素にデータオブジェクトが存在しなければ、 データオブジェクトを作成し、関連付けをしないことです。 対照的に$.data(element)は、もしデータオブジェクトが存在しない場合、 それを作成して常にデータオブジェクトを呼び出し先に返すようにしてしまいます。

jQueryのイベントシステムは、イベントハンドラを蓄積するために、jQueryのデータAPIを使用することに注意してください。 そのため、.on().bind().live().delegate()か、 イベントメソッドの略記を使用してイベントを要素に紐付けると、データオブジェクトも同様に要素に関連付けられます。

デモ

<!DOCTYPE html>
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
</head>
<body>
  <p>出力結果: </p>
<script>
var $p = jQuery("p"), //P要素(jQueryオブジェクト)
    p  = $p[0];       //P要素(上記から要素オブジェクトを取り出したもの)
$p.append(jQuery.hasData(p)+" "); /* false */

//データ"testing"に123を関連付け
$.data(p, "testing", 123);
$p.append($.hasData(p)+" "); /* true*/

//データ"testing"を削除
$.removeData(p, "testing");
$p.append($.hasData(p)+" "); /* false */

//dataではなく、onメソッドでもdataが紐づけられる事が確認できる。
$p.on('click', function() {});
$p.append($.hasData(p)+" "); /* true */

//上記のclickイベントを削除
$p.off('click');
$p.append($.hasData(p)+" "); /* false */

</script>
</body>
</html>

 Back to top

© 2010 - 2017 STUDIO KINGDOM