0

我正在编写一个快捷方式 JavaScript 文件来制作$date和$time变量。据我所知，它应该可以工作，但它不会显示并且 Google Chrome 的调试器会显示[Uncaught TypeError: Cannot Read 'firstChild' of null]

这是我的代码：

function mdy(){

    var
        h = new Date(),
        year = h.getFullYear(),
        month = h.getMonth() + 1,
        day = h.getDate();

        if(month < 10) { month = "0" + month; }

        if(day < 10) { month = "0" + month; }

        var string = month + "/" + day + "/" + year;

        document.getElementById('mdy').firstChild.nodeValue = string;

}

function ymd(){

    var
        h = new Date(),
        year = h.getFullYear(),
        month = h.getMonth() + 1,
        day = h.getDate();

        if(month < 10) { month = "0" + month; }

        if(day < 10) { month = "0" + month; }

        var string = year + "/" + month + "/" + day;

        document.getElementById('ymd').firstChild.nodeValue = string;

}

var $date = {

    mdy: '<span id="mdy">&nbsp;</span>',
    ymd: '<span id="ymd">&nbsp;</span>'

}

/* $time module */
// this comes in two formats, standard and military. 
// type $time.standard for standard time and $time.military
// for military time
function tstandard(){

    var
        h = new Date(),
        hours = h.getHours(),
        minutes = h.getMinutes();

        minutes = ( minutes < 10 ? "0" : "" ) + minutes;

        var diem = ( hours < 12 ) ? "am" : "pm";

        hours = ( hours > 12 ) ? hours - 12 : hours;

        hours = ( hours == 0 ) ? 12 : hours;

        var string = hours + ":" + minutes + " " + diem;

        document.getElementById("tstandard").firstChild.nodeValue = string;

}

function tmilitary() {

    var
        h = new Date(),
        hours = h.getHours(),
        minutes = h.getMinutes();

        minutes = ( minutes < 10 ? "0" : "" ) + minutes;

        hours = ( hours == 0 ) ? 12 : hours;

        if(hours < 10) { hours = "0" + hours }

        var string = hours + ":" + minutes;

        document.getElementById("tmilitary").firstChild.nodeValue = string;

}

var $time = {

    standard: "<span id='tstandard'>&nbsp;</span>",
    military: "<span id='tmilitary'>&nbsp;</span>"

}

/*! universal body onload function !*/
window.onload = function(){

    mdy(); setInterval('mdy()', 1000);
            ymd(); setInterval('ymd()', 1000);

    tstandard(); setInterval('tstandard()', 1000);
    tmilitary(); setInterval('tmilitary()', 1000);

}

在我的 HTML 中，我正在做：

<script>document.write($date.mdy + " - " + $time.standard);</script>
4

2 回答 2

0

我想你可能想要这个：

document.getElementById('mdy').innerHTML = string;

或这个：

document.getElementById('mdy').nodeValue = string;

而不是这个：

document.getElementById('mdy').firstChild.nodeValue = string;

那应该注意错误。（不需要firstChild从getElementById调用中获取，默认情况下它已经返回了一个节点。）

于 2012-10-26T22:19:24.587 回答
0

您正在向 DOM 添加两个占位符元素 -<span id="ymd"></span>和<span id="tstandard">.

然后，在window.onload处理程序中，您不仅尝试更新这两个占位符的内容，而且还尝试更新不在 DOM 中的其他两个元素（id="ymd"和id="tmilitary"）的内容。由于这个事实， document.getElementById('ymd')(and 'tmilitary') 调用正确返回。undefined

您想删除对ymdandtmilitary函数的调用。

window.onload = function(){
  mdy();
  setInterval(mdy, 1000);

  tstandard();
  setInterval(tstandard, 1000);
};

我还更改了调用setInterval以简化事情。传递引用更加有效和清晰。

于 2012-10-26T22:44:40.343 回答