数字时钟，要求：在浏览器视区中心显示当前（日期）时间。
实现代码如下：
html代码：

    <div>
    <p>
        <span name="ha"></span>-
        <span name="ha"></span>-
        <span name="ha"></span>&nbsp&nbsp&nbsp
        <span name="ha"></span>&nbsp：
        <span name="ha"></span>&nbsp：
        <span name="ha"></span>
    </p>
    </div>

CSS代码：本篇的重难点在这里

*{
    margin:0;
    padding:0;
    }
    div{
        width:100%;
        background: #EEEEEE;
        position: absolute;
        top:0;
        bottom:0;
    }
    p{
        position: absolute;
        top:50%;
        width: 100%;
        height:200px;
        margin-top:-100px;
        text-align: center;
        line-height: 200px;
        font-size: 40px;
    }

js代码：核心功能实现

function cur_time() {
    var date = new Date();
    var y = date.getFullYear();
    var M = date.getMonth() + 1;
    var d = date.getDate();
    var h = date.getHours();
    var m = date.getMinutes();
    var s = date.getSeconds();
    var time = [y, M, d, h, m, s];
    for (var i = 0; i < time.length; i++) {
        (time[i] < 10) && (time[i] = '0' + time[i]);
        document.getElementsByName("ha")[i].innerHTML=time[i];
    }
}
cur_time();
setInterval(cur_time, 999);

运行结果如下图，

image.png

已同时在PC和手机端浏览器测试成功，手机UC需关闭适应屏幕。