この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。
広告
posted by fanblog
2018年09月19日
jQueryの要素存在チェック
jQueryによる要素の存在チェック方法です。
他にもやり方はあると思いますが、自分が良く使うものをメモ
他にもやり方はあると思いますが、自分が良く使うものをメモ
１．$(selector)[0]
if($(selector)[0]){
alert("OK");
} else {
alert("NG");
}
alert("OK");
} else {
alert("NG");
}
２．$(selector).length
if($(selector).length){
alert("OK");
} else {
alert("NG");
}
alert("OK");
} else {
alert("NG");
}
３．$(selector)size()
if($(selector)size()){
alert("OK");
} else {
alert("NG");
}
alert("OK");
} else {
alert("NG");
}
まとめ
sizeやgetを使う方法もありますが、個人的には上の2つをよく使ってる気がします。
また、処理速度を気にするならjQueryを使用しない↓が良いかと。。。
document.getElementById("id") != null
また、処理速度を気にするならjQueryを使用しない↓が良いかと。。。
document.getElementById("id") != null
2018年09月18日
jQueryセレクタのまとめ
基本的なセレクタ
１．要素で指定する
$("要素名")
２．idで指定する
$("#id名")
※セレクタでidを指定する場合は「#」を使用する
３．classで指定する
$(".class名")
※セレクタでclassを指定する場合は「.」を使用する
複数条件での指定
１．AND条件での指定
要素、id、class等をつなげて記載する
例：「test」というidを持つdiv要素
$("div#test")
$("div#test")
例：「test」と「dummy」の２つのclassを持つ要素
$(".test.dummy")
$(".test.dummy")
２．OR条件での指定
要素、id、classなどを「,」でつなげて記載する
例：「test」classまたは「dummy」classを持つ要素
$(".test,.dummy")
$(".test,.dummy")
例：a要素または「test」というidを持つ要素
$("a,#test")
$("a,#test")
階層での指定
１．先祖要素を指定する
先祖要素＋スペース＋対象要素となるように記載する
例：「test」idを持つ要素内にある「dummy」classを持つ要素
$("#test .dummy")
$("#test .dummy")
２．親要素を指定する
「>」で「親 > 子」となるように記載する
例：「test」idを持つ要素を親に持つ「dummy」classを持つ要素
$("#test > .dummy")
$("#test > .dummy")
兄弟要素の指定
１．前後関係を指定して要素を指定する１
「+」でつなげて記載する
例：「test」idを持つ要素の次の「dummy」classを持つ要素（兄弟要素）
$("#test + .dummy")
$("#test + .dummy")
２．前後関係を指定して要素を指定する２
「~」でつなげて記載する
例：「test」idを持つ要素以降に出てくる「dummy」classを持つ全ての要素（兄弟要素）を指定
$("#test ~ .dummy")
$("#test ~ .dummy")
