<div class="box">
<div class="content selected">
<h2>.closest() 的效果</h2>
<h3>使用方式</h3>
<ul class="selected">
<li>取得所有 li 元素向上尋找祖先元素,直到第一個 class 有 "selected" 的元素停止</li>
<li class="target-1">設定匹配元素的邊框</li>
<li>只設定第一個匹配的元素,因此上層的 div class 有 "selected",但沒有被設定邊框</li>
</ul>
</div>
<div class="field is-grouped">
<button class="button is-link example-1">使用方式</button>
<button class="button reset">reset</button>
</div>
</div>
// 使用方式一
$('.example-1').on('click', function() {
$('.target-1').closest('.selected').css('border', '1px solid red');
});
// reset
$('.reset').on('click', function() {
$('*').css('border', '');
});