我直接调用函数startCount()为什么不行呢?

来源:8-5 计时器setTimeout()

穿越满天星

2016-12-21 07:03

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>计时器</title>
</head>
<script type="text/javascript">
  var num=0;
  function startCount() {
    document.getElementById('count').value=num;
    num=num+1;
    setTimeout("startCount()",1000) 
  }
  startCount()
</script>
</head>
<body>
<form>
<input type="text" id="count" />
</form>
</body>
</html>

代码如上。

为什么把startCount()这句换成:setTimeout("startCount()",1000) 就可以?

后面这句代码的目的,实际上也是为了调用函数啊。

求大神解答~

写回答 关注

1回答

  • CHFFOPSAIE
    2016-12-21 11:08:17
    已采纳

    js写在head里的话,因为html文档在加载的时候,是从上到下加载的,所以会先加载js,在js里加载到startCount()时,会执行startCount()函数,但在函数里有获取ID的document.getElementById('count'),而此时body里的内容还没加载,会找不到id为count的对象,所以会出错。setTimeout()这个函数不会截断加载的进程,而且setTimeout("startCount()",1000)会在一秒后执行,而在这一秒内整个文档早就加载完成了,就不会出现上边找不到的情况。所以可以成功执行。

    你把script标签和里面的代码放到</body>前面,就不会出错了。如:

    <!DOCTYPE HTML>

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>计时器</title>

    </head>

    <body>

    <form>

    <input type="text" id="count" />

    </form>

    <script type="text/javascript">

      var num=0;

      function startCount() {

        document.getElementById('count').value=num;

        num=num+1;

        setTimeout("startCount()",1000) 

      }

      startCount()

    </script>

    </body>

    </html>

    ps:话说你js实际上不是写在head里(因为在<script>标签前head已经结束了),而是写在head和body之间了(虽然js写在哪儿都行)。

    秋挽词 回复CHFFOP...

    原来如此~非常感谢!!

    2016-12-22 12:45:33

    共 9 条回复 >

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468191 学习 · 21891 问题

查看课程

相似问题