这段 javascript代码的运行机制

Question

问题：为什么onclick事件能正确获取到我点的是数组哪个元素，还有下标。（tab，tabPos）for循环至setTabHandler(tab,i)，执行函数循环调用3次该函数，它不是直接循环完了吗？这段javascript代码应该不是从我点击开始onclick事件才执行的吧？Tabbedinfoboxhtml{font-family:sans-serif;}*{box-sizing:border-box;}body{margin:0;}.info-box{border:1pxsolidred;width:452px;height:400px;margin:0auto;}.info-boxul{padding-left:0;margin-top:0;}.info-boxli{float:left;list-style-type:none;width:150px;}.info-boxlia{border:1pxsolidblack;display:block;text-decoration:none;width:100%;line-height:3;background-color:red;color:black;text-align:center;}.info-boxlia:focus,.info-boxlia:hover{background-color:#a60000;color:white;}.info-boxlia.active{background-color:#a60000;color:white;}.info-boxlia.demo{background-color:#030303;color:white;}.info-box.panels{position:relative;height:352px;clear:both;}.info-boxarticle{position:absolute;top:0;left:0;height:352px;padding:10px;color:white;background-color:#a60000;}.info-box.active-panel{z-index:1;}Tab1Tab2Tab3Thefirsttab1Loremipsumdolorsitamet,ThesecondtabThistabhasn'tgotanyLoremIpsuminit.Butthecontentisn'tveryexcitingallthesame.Thethirdtab3Loremipsumdolorsitduinequeeleifendlorem,aauctorliberoturpisatsem.Aliquamutporttitorurna.Nullafacilisivartabs=document.querySelectorAll('.info-boxlia');varpanels=document.querySelectorAll('.info-boxarticle');for(i=0;i

Answer 1

为什么onclick事件能正确获取到我点的是数组哪个元素，还有下标。（tab，tabPos）
因为一开始就已经通过循环把元素和下标传递给setHandler了。
for循环至setTabHandler(tab,i)，执行函数循环调用3次该函数，它不是直接循环完了吗？
每循环一次就给对应下标的元素注册监听函数，然后就结束了这没错。
这段javascript代码应该不是从我点击开始onclick事件才执行的吧？
只有tab.onclick=function(){...}这一段是你点击后才执行的，其他的都是页面一加载完就执行了。