我有 2 个arrays
或更多的可能性NodeLists
,
const mainSlides = document.querySelectorAll('.mainSlides')
const thumbSlides = document.querySelectorAll('.thumbSlides')
目前我正在像这样迭代它们:
mainSlides.forEach(slide => {
slide.style.backgroundColor = `red`
})
thumbSlides.forEach(slide => {
slide.style.backgroundColor = `red`
})
由于它们都设置了相同的属性,即;background-color:red;
, 是否有一种速记方式可以同时遍历两个节点列表?
const mainSlides = document.querySelectorAll('.mainSlides')
const thumbSlides = document.querySelectorAll('.thumbSlides')
mainSlides.forEach(slide => {
slide.style.backgroundColor = `red`
})
thumbSlides.forEach(slide => {
// slide.style.backgroundColor = `red`
})
<div class="holder">
<div class="mainSlides"> some mainSlides </div>
<div class="mainSlides"> some mainSlides </div>
<div class="mainSlides"> some mainSlides </div>
<div class="mainSlides"> some mainSlides </div>
</div>
<div class="holder">
<div class="thumbSlides"> some mainSlides </div>
<div class="thumbSlides"> some mainSlides </div>
<div class="thumbSlides"> some mainSlides </div>
<div class="thumbSlides"> some mainSlides </div>
</div>
您可以选择两者mainSlides
并thumbSlides
像这样:
const allSlides = document.querySelectorAll('.mainSlides, .thumbSlides');
或者,如果您不想将它们一起选择(例如,如果您想进一步单独使用它们)而只想将它们一起用于此特定操作:
const allSlides = [...mainSlides, ...thumbSlides];
allSlides.forEach(slide => {
slide.style.backgroundColor = 'red';
})
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句