Javascript 刷新时间 HTML 文本框； getElementByID 错误

Question

我试图让时间在 HTML 页面的文本框中每秒显示一次，但我只是收到错误消息，指出 getElementByID 不存在。我的代码如下。下面的代码没有任何显示。你能纠正我，或者指出我遗漏了什么吗？

function getTime() {
     var currentDate = new Date();
     var date = currentDate.toLocaleString();
     document.getElementById("clock").innerHTML = date;
}

var repeatedTime = setInterval("getTime()", 1000);
getTime();

这是我的 HTML 代码：

<!DOCTYPE html>
<html>
<head>
     <script src="clockjavascript.js" ></script>
</head>
<body>
    <form>
        <input id="clock" type="text" />
    </form>
</body>
</html>

感谢 Daniel Szabo，他解决了这个问题。与 HTML 一起使用的正确 javascript 如下。我需要将 document.getElementById("clock").innerHTML 更改为 .value.

function getTime() {
    var dateObject = new Date();
    var dateString = dateObject.toLocaleString();
    document.getElementById("clock").value = dateString;
}

var repeatedTime = setInterval(getTime, 1000);
getTime();

Answer 1

您的语法略有偏差 -

getElementById

而不是

getElementByID

后者作为一种方法不存在。

Answer 2

四期

使用getElementById代替getElementByID（"d"需要小写"）
使用 document.getElementById("clock").value 而不是 innerHTML 来操作文本框的内容
尝试 setInterval(getTime, 1000); 而不是 setInterval("getTime()", 1000);
将 <script src="clockjavascript.js"></script> 标签移到页面底部，就在 </body> 标签之前。这样，被操作的 <input> 元素就会被渲染，并且可以在脚本执行时被操作。

要进行快速测试，您可以将其粘贴到浏览器控制台并观察时间的流逝。

function getTime() {
   var currentDate = new Date();
   var date = currentDate.toLocaleString();
   console.log(date);
}

var repeatedTime = setInterval(getTime, 1000);
getTime();

Javascript 刷新时间 HTML 文本框； getElementByID 错误

Javascript refresh time in HTML text box; getElementByID error

javascript

date

getelementbyid