关于setInterval执行顺序的疑惑

HTML代码如下：

<html>
<body>
    <input type="text" name="time" />
</body>
</html>

代码1：

function showTime() {
    var today = new Date();
    var hou = today.getHours();
    var min = today.getMinutes();
    var sec = today.getSeconds();
    document.getElementsByName('time')[0].value = hou + ':' + min + ' ' + sec;
}

setInterval(showTime,1000);

代码2：

function showTime() {
    var today = new Date();
    var hou = today.getHours();
    var min = today.getMinutes();
    var sec = today.getSeconds();
    document.getElementsByName('time')[0].value = hou + ':' + min + ' ' + sec;
}

showTime();

代码2在html中不显示我理解，从上到下执行，input没加载，不执行正常，但代码1多了个setInterval怎么就可以执行了呢？input不是没载入吗？

首先 setInterval(showTime,1000);是异步的。

是否input加载完后执行不确定。

如果时间间隔小，他可能在加载前执行，但是我们没感觉到。可以用审查看一下。

setInterval是立即执行的但是它执行的是在动作是在1秒后插入你自己的程序所以setInterval即使在文档没加载完执行也不会报错代码1设定为1秒后执行实际是估计1秒后你的文档加载完了如果网速慢到无法在1秒内加载完毕代码1同样会报错

比较稳妥的做法我觉得应该是使用$(function(){/代码/})——如果你用jquery 或 window.addEventListener('load',function(){/代码/},false)——原生写法

【热门文章】