jQuery 奇数番目の要素(:odd)のサンプル

2023年3月24日

環境
Google Chrome　111.0.5563.65（Official Build）
Windows 10 Home 64bit
jquery 3.6.3

書式
$(“input:odd").css(“background-color","色の値");
奇数番目のInput要素の背景色を設定します。
最初は、0から始まります。1行目は偶数です。

使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("#chk").click(function(){
    $("input:odd").css("background-color","red");
  });
});
</script>
</head>
<body>

<p><input type="text" id="text1" value="to"></p>
<p><input type="text" id="text2" value="sa"></p>
<p><input type="text" id="text3" value="ko"></p>
<button id="chk">変更</button>
</body>
</html>

実行結果
「変更」ボタンをクリックして，2行目のテキストボックスの入力欄が赤色にになります。

jQuery

Posted by arkgame

関連投稿: