带有java脚本的实时时钟,显示实际的秒数和小时数

时间:2014-11-26 17:00:13

标签: javascript html css html-helper clock

我正在尝试用java脚本制作一个时钟来实时显示实际时间但由于某种原因它不起作用..我还需要按钮和按钮来改变颜色时钟。

非常感谢任何帮助。

<html>


<head>


<title>    Clock II & III   </title>

            <link rel="stylesheet" type="text/css" href="clock.css">


            <script type = "text/javascript">

                function renderTime() {

            var currentTime() = new Date(); 
            var diem = "AM"
            var h = currentTime.getHours();
            var m = currentTime.getMinutes();
            var s = currentTime.getSeconds();


            if (h ==0){
                h = 12
            }   else if (h>12) {
                h = h - 12; 
                diem = "PM";

            }

            if (h<10){
                h = "0" + h;

            }

            if (m<10){
                m = "0" + m;

            }

            if (s<10){
                s = "0" + s;

            }


            var myClock = document.getElementById('clockdisplay')
            myClock.textContent = h + ":" + m + ":" + s + " " + diem; 
            myClock.innerText = h + ":" + m + ":" + s + " " + diem; 
            setTimeout('renderTime()',1000);
            }


            renderTime(); 
            </script>


</head>


<body>



<div id = "clockdisplay" class = "clockStyle">      
22:23PM
</div>



<body>



</html>


#clockdisplay {

    background-color:#000;
    border:#999 2px inset;
    padding:6px;
    color:#0FF;
    font-family:"Ariel Black", Gadget, sans-serif;
    font-size:16px;
    font-weight:bold;
    letter-spacing:2px;
    display:inline;

}

1 个答案:

答案 0 :(得分:0)

你有很多语法错误。 尝试改变:

var currentTime() = new Date();var currentTime = new Date();

setTimeout('renderTime()',1000);setTimeout(renderTime,1000);

你也有一些缺失的分号,但是这两个变化会使它起作用,正如你在fiddle中看到的那样。