如何正确地从document.querySelectorAll()遍历NodeList？
如何正确地从document.querySelectorAll()遍历NodeList？
提问于 2018-06-04 01:40:44
在学习不同AJAX请求的练习中，我想在每次单击按钮时在#quote上应用淡入淡出过渡。(淡出效果不是练习的一部分，它只是我自己添加的东西)
我知道在document.querySelector()中只有一个按钮(或者只有第一个按钮)时该如何操作，但我了解到document.querySelectorAll()以数组的形式返回一个静态NodeList，您需要遍历该数组才能对每个按钮执行某些操作。
我试过几件事，但还是弄不明白。
这就是我到目前为止所拥有的，据我所知，这两段代码需要在彼此内部，我的问题是如何实现。
// Quote animation
var buttons = document.querySelectorAll("button");
[].forEach.call(buttons, function(button){
// quote should have .fade applied every time one of the four buttons is clicked
});
$(button).addEventListener("click", function(){
$(quote).addClass("fade");
$(quote).bind('oanimationend animationend webkitAnimationEnd', function(){
$(this).removeClass("fade");
});
})回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-04 01:52:49
这将选择每个按钮，并触发您的淡入淡出效果
$("button").on('click', function(){
$(quote).addClass("fade");
$(quote).bind('oanimationend animationend webkitAnimationEnd', function(){
$(this).removeClass("fade");
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50669221
复制相关文章
相似问题