html中的javascript日期显示[关闭]

Question

我正在尝试在<p></p> 标签中包含一个实时时钟。

我的js代码如下：

function updateClock ( )
{
  var currentTime = new Date ( );

  var currentHours = currentTime.getHours ( );
  var currentMinutes = currentTime.getMinutes ( );
  var currentSeconds = currentTime.getSeconds ( );

  // Pad the minutes and seconds with leading zeros, if required
  currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
  currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;

  // Choose either "AM" or "PM" as appropriate
  var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";

  // Convert the hours component to 12-hour format if needed
  currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;

  // Convert an hours component of "0" to "12"
  currentHours = ( currentHours == 0 ) ? 12 : currentHours;

  // Compose the string for display
  var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;

  // Update the time display
  document.getElementById("clock").firstChild.nodeValue = currentTimeString;
}

位于“date.js”文件中，我已将其包含在 HTML 代码中

HTML 代码是

 <p id="clock">&nbsp;</p>

但没有显示正确... 有什么解决办法吗？

Answer 1

您的 <p> 元素的 id 为“时钟”，并且您将值设置为

document.getElementById("clock").firstChild.nodeValue = currentTimeString;

<p> 中的子元素在哪里，可以将 currentTimeString 的值设置为上面的元素，该元素在您的 html 文件中不存在或未定义。

你可以这样显示值

document.getElementById("clock").innerHTML = currentTimeString;

Answer 2

document.getElementById("clock").innerHTML = currentTimeString; 应该可以解决问题

Answer 3

http://jsfiddle.net/txzqt/

它似乎工作得很好。我猜你忘了在这里调用 updateClock() 函数本身。

Answer 4

首先，如果您使用的是 date.js，那么您可以在上面内置功能来执行您正在执行的操作。只需执行：

   var currentTimeString = new Date().toString('hh:mm:ss tt');

在运行代码之前，您还必须确保您的页面已加载。你是在body onload上运行这个吗？还是您在页面末尾调用您的函数？这些中的任何一个都应该工作。