jQuery closestメソッドで祖先要素に一番近い要素を取得する

環境
jquery 3.6.3
jqueryui 1.12.1
Google Chrome 110.0.5481.104（Official Build） （64 ビット）

構文
1.ボタンのイベントの定義
$(“button").click(function(){処理コード})

2.$(“#セレクタID").closet(“要素タグ")
closestメソッドは、祖先要素で指定した引数に一番近い要素を取得します。

使用例

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
  $("button").click(function(){
     $("#japan").closest("ul").css("color","green");
  });
});
</script>
</head>
<body>
 <ul id="ss">
   <ul id="cityname">
     <li id="tokyo">東京</li>
     <li id="oosaka">大阪</li>
   </ul>
   <ul id="country">
     <li id="america">アメリカ</li>
     <li id="japan">日本</li>
   </ul>
 </ul>
 <button id="chk">表示</button>
</body>
</html>

実行結果
「表示」ボタンを押すと、「id=japan」から一番近いUI要素「id=america」を取得します。

jQuery

Posted by arkgame