dataメソッド

メソッドdataは、任意のタイプのデータをDOM要素に安全な方法でバインドし、メモリリークを回避することができます。 1つの要素に対して複数の異なる値を設定し、後でそれらを取得することができます。メソッドdataを使用してデータを更新しても、DOM内の属性には影響しません。

構文

以下の方法で、任意の要素に値を設定し、後で検索するためのキーを指定できます：

.data(キー, 値);

データを更新するためのキーと値のペアを含むオブジェクトを渡すこともできます：

.data(オブジェクト);

キーのみを渡すことで、jQueryコレクション内の最初の要素に関連付けられたデータを取得できます：

.data(キー);

パラメータを渡さない場合、以前にDOM要素に関連付けられたデータを読み取ることができます。このメソッドは、各値をプロパティとして含むJavaScriptオブジェクトを返します：

.data();

dataを使用して、最初のパラメータとして'test'を、 2番目として値21をpタグに設定しましょう。その後、キー'test'で保存されたデータを読み取ります：

<p>テキスト</p>

$('p').data('test', 21); // ここでデータが書き込まれる

console.log($('p').data('test')); // 数値21を出力
console.log($('p').data()); // オブジェクト {test: 21} を出力