九州編程
2023-04-27 16:40:21
我有以下有效的 ecmascript,但如果可能的話,我寧愿將其減少到一行,或者只是下一個最好的東西,而不是多次編寫 querySelectorAll。我該如何利用這一點? document.querySelectorAll('main .testimonials ul.shadow-box')[2].classList.remove('shadow-box'); document.querySelectorAll('main .testimonials ul.shadow-box')[1].classList.remove('shadow-box'); document.querySelectorAll('main .testimonials ul.shadow-box')[0].classList.remove('shadow-box');
2 回答

猛跑小豬
TA貢獻1858條經驗 獲得超8個贊
您可以使用forEach()只執行一次查詢,然后遍歷結果。
document.querySelectorAll('main .testimonials ul.shadow-box').forEach(function(el) {
el.classList.remove('shadow-box');
});
ul {
background: red;
min-height: 20px;
}
.shadow-box {
background: blue;
}
<main>
<div class="testimonials">
<ul class="shadow-box"></ul>
<ul class="shadow-box"></ul>
<ul class="shadow-box"></ul>
<ul class="shadow-box"></ul>
</div>
</main>

慕碼人8056858
TA貢獻1803條經驗 獲得超6個贊
您可以創建一個數組,然后slice創建它,然后循環遍歷它。
[...document.querySelectorAll('main .testimonials ul.shadow-box')]
.slice(0, 3)
.forEach(x => x.classList.remove('shadow-box'));
添加回答
舉報
0/150
提交
取消