数字时钟在 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/
我制作了一个数字时钟,它适用于 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/