jQuery - データ保存関連 - liguofeng29’s blog

jQuery対象にname-value形式で一時データ保存先として保存、取得ができる。

jQueryオブジェクトのメソッド

・保存

data(name, value)
data(obj) : ({name1:value1, name2:value2})形式

・取得

data()

・削除

removeData([name])
removeData([list])

jQuery 名前空間のメソッド

・保存

jQuery.data(element, name, value)

・取得

jQuery.data(element, name)
jQuery.data(element)

・削除

jQuery.removeData(element[,name])
jQuery.hasData(element) : データがあるか

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   <title> jQuery.data関連 </title>
</head>
<body>
<div>
    名前<span></span>
    年齢<span></span>
</div>
<script type="text/javascript" src="jquery-1.12.0.min.js">
</script>
<script type="text/javascript">
   var target = $("<div>java</div>");
   // データ保存
   target.data("code" , "java");
   // 取得
   alert(target.data("code"));

   // 削除
   target.removeData("code");
   // 取得
   alert(target.data("code"));

   // div[0]取得
   var div = $("body>div")[0];
   
   // データ保存
   $.data(div, "p1", { name: "AAA", age: 500 });
   
   // 表示
   $("span:first").text(jQuery.data(div, "p1").name);
   $("span:last").text(jQuery.data(div, "p1").age);
</script>
</body>
</html>