とほほのjQuery入門

トップ > jQuery > Miscellaneous

Miscellaneous(Collection Manipulation)

obj.each(function(index, element)) (1.0)

obj の各要素に対して関数を実行します。

JavaScript
$("div").each(function() {
    alert($(this).html());
});
HTML
<div id="d1">D1</div>
<div id="d2">D2</div>
<div id="d3">D3</div>
<div id="d4">D4</div>
<div id="d5">D5</div>

Miscellaneous(DOM Element Methods)

obj.size() (1.0/廃止:1.8)

obj の個数を返します。jQuery 1.8 で非推奨となり、jQuery 3.0 で削除されました。代わりに .length を使用してください。

JavaScript
var num = $("h1").size();
obj.get([index]) (1.0)

jQuery配列を JavaScript配列に変換します。index を指定すると、0から数えて index番目の要素のみを JavaScript要素に変換します。省略した場合はすべての要素を配列で返します。下記の例では、$("div.data") で取得した jQuery配列を get() で JavaScript配列に変換し、JavaScriptの機能で sort() しています。

JavaScript
divs = $("div.data").get().sort();
for (var i = 0; i < divs.length; i++) {
    $("#log").append(divs[i].innerHTML);
}
obj.toArray() (1.4)

get() と同様、jQuery配列を JavaScript配列に変換します。

JavaScript
divs = $("div.data").toArray().sort();
for (var i = 0; i < divs.length; i++) {
    $("#log").append(divs[i].innerHTML);
}
obj.index() (1.4)
obj.index(selector) (1.4)
obj.index(element) (1.0)

index() の形式は、兄弟要素における該当要素のインデックスを返します。

JavaScript
$("tr").each(function() {
    $("#log").append("n=" + $(this).index() + "<br>");    // n=0  n=1  n=2...
});

index(selector) の形式は、selector で示される要素集合における obj のインデックスを返します。要素集合内に存在しない場合は -1 を返します。

JavaScript
$("tr").each(function() {
    $("#log").append("n=" + $(this).index("tr.data") + "<br>");
});

index(element) の形式は、obj 集合における element のインデックスを返します。集合内に存在しない場合は -1 を返します。

JavaScript
$("tr").each(function() {
    $("#log").append("n=" + $("tr").index(this) + "<br>");
});

Miscellaneous(Data)

obj.data(key, value) (1.2.3)
obj.data(keyValues) (1.4.3)
obj.data(key) (1.2.3)
obj.data() (1.4)

objkey=value のデータを設定・参照します。

JavaScript
$("#total").data("totalFee", "128000");
var totalFee = $("#total").data("totalFee");    // "128000"

下記の様な指定も可能です。

JavaScript
$("#data").data({ name: "Mike", age: 36 });
var name = $("#data").data("name");              // "Mike"

引数を省略するとすべての値を取得します。

JavaScript
$("#data").data({ name: "Mike", age: 36 });
var name = $("#data").data();                    // { name: "Mike", age: 36 }
obj.removeData([name]) (1.2.3)
obj.removeData(list) (1.7)
◆ $.removeData(element[, name]) (1.2.3)

objelement から data() で設定した値を削除します。引数を省略するとすべてのデータを削除します。

JavaScript
$("#total").data("totalFee", "128000");
$("#total").removeData("totalFee");

$("#data").data({ name: "Mike", age: 36 });
$("#total").removeData("name", "age");

$("#total").removeData();

$.removeData($("#total").get()[0], "name");
◆ $.hasData(element) (1.5)

指定した JavaScript要素がデータを持っているか否かを true / false で返します。

JavaScript
$(document.body).data("currentFocus", "text1");
$("#log").append("data = " + $(document.body).data("currentFocus") + "\n");
$("#log").append("hasData = " + $.hasData(document.body) + "\n");

Copyright (C) 2013-2019 杜甫々
初版:2013年2月3日、最終更新:2019年5月5日
http://www.tohoho-web.com/js/jquery/miscellaneous.htm