tab切换和模态框
2017-09-30 本文已影响0人
向前冲冲的蜗牛
1： 实现如下图Tab切换的功能
image.png
代码地址是：https://jsbin.com/befesa/edit?html,output
其中遇到了一个问题 就是document.querySelectorAll（）与forEach的使用的问题。
使用 document.querySelectorAll（）返回的元素直接使用forEach（）会出错。
其真正的原因是document.querySelectorAll（）返回的是 NodeList ，其实就是一个类数组，但是并不是真正的数组，所以类数组在使用数组的方法的时候会出现问题。
所以解决办法是
image.png
同时对于这个问题在Stackoverflow上也有相应的解答
https://stackoverflow.com/questions/21714754/what-is-the-return-type-of-document-queryselectorall
2：实现下图的模态框功能，点击模态框不隐藏，点击关闭以及模态框以外的区域模态框隐藏
image.png
image.png
