jQuery prevとnext前と後の要素取得する
jQuery prev前の要素取得する
prevは英語の略語で
previous(以前の)
等です。
prevは指定した要素の前の要素を取得します。
サンプル
$(“セレクタ”).prev().メソッド()
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(function(){
$(“.botton”).click(function(){
$(“.two”).prev().css(“color”,”red”)
});
});</script>
<title>
</title>
</head>
<body>
<input type=”button” value=”botton” class= “botton” >
<div>
<ul>
<li>1</li>
<li class=”two”>2</li>
<li>3</li>
</ul>
</div>
</body>
</html>
実行結果は
1の色が赤になります。
jQuery next後の要素取得する
nextは英語で次です。
次ということは指定した要素の後ろの要素ですね。
サンプル
$(“セレクタ”).next().メソッド
サンプル
<html>
<head>
<script src=”jquery-3.2.1.js”></script>
<script>
$(function(){
$(“.botton”).click(function(){
$(“.two”).prev().css(“color”,”red”)
});
});</script>
<title>
</title>
</head>
<body>
<input type=”button” value=”botton” class= “botton” >
<div>
<ul>
<li>1</li>
<li class=”two”>2</li>
<li>3</li>
</ul>
</div>
</body>
</html>
実行結果は
3が赤になります。