数字时钟在 FireFox 中不工作

digital clock not working in FireFox

我制作了一个数字时钟,它适用于 IE(只要我允许 Javascript)和 Google Chrome。但是,我无法让它在 FireFox 中运行。这很奇怪,因为我的网页中有其他 JavaScript 在 FireFox 中运行良好(验证、cookie 等)。一定是FireFox浏览器中的数字时钟有关。

我想知道是否有人可以看看 FireFox 是否不允许我使用的东西。感谢您的时间! :)

JavaScript

                                        /*##### CLOCK #####*/
function displayDate()
{
    var dateObject = new Date();
    var dayArray = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"); //Day Array
    var monthArray = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"); //Month Array
    var day = dateObject.getDay();
    var month = dateObject.getMonth();

    var dateDiv = document.getElementById("theDate"); //Connect to the HTML theDate ID
        dateDiv.innerText = " " + dayArray[day] + ", " + monthArray[month] + " " + dateObject.getDate() + ", " + dateObject.getFullYear() + " "; //Prints out on screen
}   


function digitalClock() 
{
    function displayTime() 
    {

        var currentTime = new Date();
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
        var seconds = currentTime.getSeconds();   
        var meridiem = "AM";  // Default set to AM

        if (hours > 12) // if hours is greater than 12
        {
            hours = hours - 12;

            meridiem = "PM";  
        }

        if (hours === 0) //if hours is 0 then show 12
        {
            hours = 12;    
        }

        if(hours < 10) // if hours is less than 10 then add 0 - 9 will read as 09
        {
            hours = "0" + hours;
        }

        if(minutes < 10) // same if statement for minutes and seconds
        {
            minutes = "0" + minutes;
        } 

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

    var clockDiv = document.getElementById("clock"); //Connects to the HTML clock div
        clockDiv.innerText = hours + ":" + minutes + ":" + seconds + " " + meridiem; // Prints out on screen
}

displayTime();

    setInterval(displayTime, 1000); //setInterval to make the clock tick each second
}

                                        /*##### CLOCK END ##### */

CSS

    #clockContainer 
{

    border-style: solid;
    border-color: #A9D0F5;
    width: 320px;
    padding: 5px;
    border: 15px 
    margin: 25px;
    background-color: gray;
    float: right;
}




                                        /* Java divs */
#clock 
{
    color: white;
    font-family: courier, monospace;
    font-size: 30px;
    text-align: center;
}
#theDate 
{
    color: white;
    font-family: courier, monospace;
    font-size: 20px;
    text-align: center;

}

HTML

<body onload="digitalClock()">


<div id="hContainer">
<div id="img"><img src="../Images/Name1.jpg" width="600" height="100" alt=""/></div>

<div id="clockContainer">
<div id="clock"></div><br />
<div id="theDate"></div>
</div>

</div>
<script type="text/javascript">
/* <![CDATA[ */

displayDate();

/* ]]> */
</script>

我已经创建了一个 .html 文件来检查时钟脚本,以确保它没有受到任何其他影响,只有这个脚本不能正常工作。

Firefox 不支持 innerText,您需要改用 textContext(适用于 FF 和 Chrome - 不确定 IE)。例如

            dateDiv.textContent = " " + dayArray[day] + ", " + monthArray[month] + " " + dateObject.getDate() + ", " + dateObject.getFullYear() + " "; //Prints out on screen

参考:
http://blog.coderlab.us/2005/09/22/using-the-innertext-property-with-firefox/