                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /JavaScript進階篇

請問在JS腳本中程序的執行順序

<!doctype?html>
<html>
<head>
<meta?charset="utf-8">
<title>無標題文檔</title>
<script?type="text/javascript">
????
?????????window.onload?=?function(){
			?var?div=document.getElementsByTagName("div");
?????????????for(var?i=?0;i<div.length;i++){
?????????????????div[i].onclick=?function()?{????????????????????
?????????????????????document.write(i);
?????????????????}
				?alert(i);
?????????????}
?????????}
????</script>
</head>

<body>
<div>好的1</div>
<div>好的2</div>
<div>好的3</div>
<div>好的4</div>
<div>好的5</div>
</body>
</html>

在我點擊這幾個DIV的時候，i的值都是5，for循環是先執行完了嗎？難道不是程序執行到onclick這里就等著，等我點擊了再繼續執行嗎？我才開始學JS沒多久，還請大家指點一下??！

lsolal

2014-12-13

源自：JavaScript進階篇 10-1

關注問題我要回答

1857

操作

收起

2 回答

Tracy_
2014-12-14

這個不是js執行順序的問題而是典型的閉包問題。

涉及的內容比較多，需要看的內容比較多，一時半會兒解釋不清。主要是作用域鏈的問題，建議你百度搜一下相關知識，不然我給你講也講不明白。

我給你提供幾個解決方案吧：

//方法1
?window.onload?=?function(){
?????????????var?div=document.getElementsByTagName("div");
?????????????for(var?i=?0;i<div.length;i++){
?????????????????div[i].onclick=?function(num)?{????????????????????
????????????????????return?function(){
????????????????????????alert(num);
????????????????????}?
?????????????????}(i)
?????????????}
?????????}
//方法2
window.onload?=?function(){
?????????????var?div=document.getElementsByTagName("div");
?????????????for(var?i=?0;i<div.length;i++){
?????????????????div[i].index?=?i;
?????????????????div[i].onclick=?function()?{????????????????????
?????????????????????alert(i)
?????????????????}
?????????????}
?????????}

仔細看看，也許對你有啟發。