今天看了addEventListener事件添加,还有做完了轮播图 轮播图下的小圆点(显示对应的点),点击切换图
<div class="dotList"> <span class="dot dotActive" data-id = "0"></span> <span class="dot" data-id = "1"></span> <span class="dot" data-id = "2"></span> <span class="dot" data-id = "3"></span> <span class="dot" data-id = "4"></span> </div> <script> function imgChange() { //实现与点的位置相同 imgList.forEach(function(item, index) { item.classList.remove("active"); }) imgList[imgIndex].classList.add("active"); } dot.onclick = function(e) { //设置父元素的点击事件,利用冒泡,获取点击的当前元素(事件由子元素触发直到html) if(e.target.tagName == "SPAN") { //判断点中小圆点 console.log("span"); imgIndex = e.target.dataset.id; dotAct(); clearInterval(time1); imgChange() } } // dot.addEventListener("click", function(e) {}, false); addEventListener同一个元素的点击事件可以添加多个方法,false默认冒泡, true是捕获(从父元素到子元素) </script>