「jQuery」closest()メソッドで最初の親要素を取得する

2021年8月16日

書式
$(セレクタ).on('click’,function()
使用例
1.htmlコード

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
<div class="cft A">
<div class="cft B">
<button>テスト</button>
</div>
</div>
<div class="cft A"> <div class="cft B"> <button>テスト</button> </div> </div>
<div class="cft A">
  <div class="cft B">
      <button>テスト</button>
    </div>
  </div>

2.JSコード

セレクタを指定しない

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
$('button').on('click', function(){
$(this).closest();
});
$('button').on('click', function(){ $(this).closest(); });
$('button').on('click', function(){
  $(this).closest();
});

複数要素を指定

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
$('button').on('click', function(){
$(this).closest('.cft');
});
$('button').on('click', function(){ $(this).closest('.cft'); });
$('button').on('click', function(){
  $(this).closest('.cft');
});

上位階層に要素を指定

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
$('button').on('click', function(){
$(this).closest('.cft.A');
});
$('button').on('click', function(){ $(this).closest('.cft.A'); });
$('button').on('click', function(){
  $(this).closest('.cft.A');
});

 

jQuery

Posted by arkgame