為何點(diǎn)擊a屬性的文字，圖片會(huì)改變？

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script>
    var n = 1;
    function changePic(m){
        return n = m;
    }

    function change(){
        var myImg = document.getElementsByTagName("img")[0];
        myImg.src = "images/0" + n + ".jpg";
        if(n<5)n++;
        else n=1;
    }
    
    </script>
</head>
<body onload="setInterval(change,2000);">
    <img src="images/01.jpg" alt="" width="200">
    <div>
        <a href="#" onclick="changePic(1)">屋檐</a>
        <a href="#" onclick="changePic(2)">旅途</a>
        <a href="#" onclick="changePic(3)">紅墻</a>
        <a href="#" onclick="changePic(4)">梅花</a>
        <a href="#" onclick="changePic(5)">宮殿</a>
    </div>
</body>
</html>

上面的代碼很簡(jiǎn)單，圖片每隔2秒，換一次，這個(gè)我理解。

問(wèn)題是，當(dāng)我點(diǎn)擊某個(gè)a 的屬性，比如旅途，圖片為何會(huì)跳轉(zhuǎn)到旅游這個(gè)圖片呢？
changePic僅僅返回了一個(gè)數(shù)字 2 ，并沒(méi)有看出會(huì)改圖片？
change 和 changePic 是兩個(gè)函數(shù)，changePic也無(wú)法調(diào)用change函數(shù)哈？

回答

編輯回答

綰青絲

n是一個(gè)全局變量。

changePic并沒(méi)有修改圖片，他只是修改了n。

在change里面，邏輯是：將圖片的編號(hào)替換為n，然后將n修改為下一次的編號(hào)。
那么在下一個(gè)change執(zhí)行之前呢，changePic提前修改了n的值，導(dǎo)致change將點(diǎn)擊的編號(hào)展示了出來(lái)。
這個(gè)n就是點(diǎn)擊時(shí)傳入的。

所以這是一個(gè)全局變量的運(yùn)用問(wèn)題。changePic沒(méi)有改圖片，只是改了一個(gè)變量，這個(gè)變量用于描述下一張圖片的編號(hào)。

點(diǎn)擊也沒(méi)有立即換圖，換圖還是等到了Interval的兩秒到了，才通過(guò)change換圖

2017年7月27日 18:54