jQuery - 可視フィルター
公開日：2018-12-10
更新日：2019-05-14
更新日：2019-05-14
1. 概要
可視フィルターで要素を指定します。
$("セレクタ:hidden") //inputタグのhidden、または非表示の要素
$("セレクタ:visible") //表示されている要素
2. サンプル
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jQuery</title><style>body{color:#fff; background-color:#000;}</style></head>
<body>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<!-- 画面 -->
<div id="a">
<div style="display:none">A-0</div>
<input type="hidden" value="A-1" />
<div >A-2</div>
<span >A-3</span>
</div>
<!-- Script -->
<script>
$(function(){
//対象：非表示になっている要素 -> 表示する
$("div:hidden").css("display", "block");
//対象：inputタグの hidden -> コンソールに value を出力する
console.log( $("input:hidden").val() );
//対象：spanタグの表示されている要素 -> 文字を赤くする
$("span:visible").css("color", "red");
});
</script>
</body></html>
実行結果：画面
A-1
