如何解决定位列表中除单击之外的所有元素
多年来我一直在使用jQuery，但最终还是尝试学习简洁的Vanilla JS。
<div id="seriesList" class="seriesList rollable">
<div class="seriesLink" series="7">
<a href="#carrow-road"><h3 class="name">Carrow Road</h3><p class="location">norwich</p></a>
</div>
<div class="seriesLink" series="6">
<a href="#white-lane"><h3 class="name">White Heart Lane</h3><p class="location">London</p></a>
</div>
<div class="seriesLink" series="5">
<a href="#parc-des-princes"><h3 class="name">Parc des Princes</h3><p class="location">Paris</p></a>
</div>
</div
单击一个.seriesLink后，我将切换一系列GSAP动画。我要实现的第一个目标是使每个元素都消失不见。 即：我点击＃carrow-road-＃white-lane和＃parc-des-princes将消失。
我有这个：
document.querySelectorAll(".seriesLink").forEach(item => {
item.addEventListener('click',event => {
// ForEach.Not ?
document.getElementById("seriesList").classList.toggle("rollable");
document.getElementById("home").classList.add("scrollable");
document.getElementById("rightPanel").classList.remove("scrollable");
tlOpenSeries.play();
})
})
Javascript中的“类”系统让我迷失了方向，因为我似乎无法成功定位目标元素。
我找不到一种方法来“重现” jquery提供的each.not。任何想法？我是否应该先将一个类添加到clicked元素中，然后然后定位所有没有该“活动”类的元素？有捷径吗？
非常感谢
解决方法
要在普通JS中完成此操作，您必须遍历元素，并检查当前元素是否不是被单击的元素。
演示：
var divs = document.querySelectorAll(".seriesLink");
divs.forEach(item => {
item.addEventListener('click',event => {
for(var i = 0; i < divs.length; i++){
if(event.currentTarget != divs[i]){ // check here
divs[i].style.display = "none";
}
}
//.......
//.......
});
});<div id="seriesList" class="seriesList rollable">
<div class="seriesLink" series="7">
<a href="#carrow-road"><h3 class="name">Carrow Road</h3><p class="location">Norwich</p></a>
</div>
<div class="seriesLink" series="6">
<a href="#white-lane"><h3 class="name">White Heart Lane</h3><p class="location">London</p></a>
</div>
<div class="seriesLink" series="5">
<a href="#parc-des-princes"><h3 class="name">Parc des Princes</h3><p class="location">Paris</p></a>
</div>
</div>,
您可以使用import sys
try:
int("test") # creates a ValueError
except BaseException as e:
print('The exception: {}'.format(e))
：
filter但是我可能认为，一个好的做法是将代码拆分为简单的小函数，例如const seriesLinks = document.querySelectorAll(".seriesLink");
seriesLinks.forEach(item => {
item.addEventListener('click',event => {
seriesLinks
.filter(i => i != item)
.forEach(i => // your logic... //);
//... rest of your code ... //
})
})
，hideAllExceptCurrent (allElemArray,currentElem)
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
