我正在尝试为网站制作时钟,时间检测有效,但我正在尝试找出一种使其循环的方法(html + js)
I'm trying to make a clock for a website, the time detection works but I'm trying to figure out a way to make it loop (html + js)
我考虑过使用无限 for 循环并立即说不行不行
这是程序,它非常大,因为我希望每个数字都单独设置。还有一些显示时间的 <div>
元素。如果你想让我添加它们,我会
var d = new Date();
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var week = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var days = ["", "1st", "2nd", "3rd", "4th", "5th", "6th", "7th", "8th", "9th", "10th", "11th", "12th", "13th", "14th", "15th", "16th", "17th", "18th", "19th", "20th", "21st", "22nd", "23rd", "24th", "25th", "26th", "27th", "28th", "29th", "30th", "31st"];
var hourAP = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
var minBegin = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
var month = months[d.getMonth()];
var weekDay = week[d.getDay()];
var day = days[d.getDate()];
var year = d.getFullYear();
var date = weekDay + ", " + month + " " + day + ", " + year;
var hour = hourAP[d.getHours()];
var minute = minBegin[d.getMinutes()];
var timeAP;
if (hour < 12) {
timeAP = "AM";
} else {
timeAP = "PM";
}
var time = hour + ":" + minute + " " + timeAP;
document.getElementById("dateResult").innerHTML = date;
document.getElementById("timeResult").innerHTML = time;
使用 setInterval() 一遍又一遍地做某事。这里我用到每秒运行(函数的第二个参数是毫秒,所以一秒=1000)
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var week = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var days = ["", "1st", "2nd", "3rd", "4th", "5th", "6th", "7th", "8th", "9th", "10th", "11th", "12th", "13th", "14th", "15th", "16th", "17th", "18th", "19th", "20th", "21st", "22nd", "23rd", "24th", "25th", "26th", "27th", "28th", "29th", "30th", "31st"];
var hourAP = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
var minBegin = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
function doTime() {
// all your code
var d = new Date();
var month = months[d.getMonth()];
var weekDay = week[d.getDay()];
var day = days[d.getDate()];
var year = d.getFullYear();
var date = weekDay + ", " + month + " " + day + ", " + year;
var hour = hourAP[d.getHours()];
var minute = minBegin[d.getMinutes()];
// an easier way
minute = (d.getMinutes() < 10 ? '0' : '') + d.getMinutes()
var second = d.getSeconds();
var timeAP;
if (hour < 12) {
timeAP = "AM";
} else {
timeAP = "PM";
}
var time = hour + ":" + minute + ":" + second + " " + timeAP;
document.getElementById("dateResult").innerHTML = date;
document.getElementById("timeResult").innerHTML = time;
}
const timeInterval = setInterval(() => doTime(), 1000);
// if you want to cancel this infinitely repeating function, call clearInterval()
// clearInterval(timeInterval)
<div>
Date: <span id='dateResult'></span>
</div>
<div>
Time: <span id='timeResult'></span>
</div>
我考虑过使用无限 for 循环并立即说不行不行
这是程序,它非常大,因为我希望每个数字都单独设置。还有一些显示时间的 <div>
元素。如果你想让我添加它们,我会
var d = new Date();
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var week = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var days = ["", "1st", "2nd", "3rd", "4th", "5th", "6th", "7th", "8th", "9th", "10th", "11th", "12th", "13th", "14th", "15th", "16th", "17th", "18th", "19th", "20th", "21st", "22nd", "23rd", "24th", "25th", "26th", "27th", "28th", "29th", "30th", "31st"];
var hourAP = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
var minBegin = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
var month = months[d.getMonth()];
var weekDay = week[d.getDay()];
var day = days[d.getDate()];
var year = d.getFullYear();
var date = weekDay + ", " + month + " " + day + ", " + year;
var hour = hourAP[d.getHours()];
var minute = minBegin[d.getMinutes()];
var timeAP;
if (hour < 12) {
timeAP = "AM";
} else {
timeAP = "PM";
}
var time = hour + ":" + minute + " " + timeAP;
document.getElementById("dateResult").innerHTML = date;
document.getElementById("timeResult").innerHTML = time;
使用 setInterval() 一遍又一遍地做某事。这里我用到每秒运行(函数的第二个参数是毫秒,所以一秒=1000)
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var week = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var days = ["", "1st", "2nd", "3rd", "4th", "5th", "6th", "7th", "8th", "9th", "10th", "11th", "12th", "13th", "14th", "15th", "16th", "17th", "18th", "19th", "20th", "21st", "22nd", "23rd", "24th", "25th", "26th", "27th", "28th", "29th", "30th", "31st"];
var hourAP = ["12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11"];
var minBegin = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55", "56", "57", "58", "59"];
function doTime() {
// all your code
var d = new Date();
var month = months[d.getMonth()];
var weekDay = week[d.getDay()];
var day = days[d.getDate()];
var year = d.getFullYear();
var date = weekDay + ", " + month + " " + day + ", " + year;
var hour = hourAP[d.getHours()];
var minute = minBegin[d.getMinutes()];
// an easier way
minute = (d.getMinutes() < 10 ? '0' : '') + d.getMinutes()
var second = d.getSeconds();
var timeAP;
if (hour < 12) {
timeAP = "AM";
} else {
timeAP = "PM";
}
var time = hour + ":" + minute + ":" + second + " " + timeAP;
document.getElementById("dateResult").innerHTML = date;
document.getElementById("timeResult").innerHTML = time;
}
const timeInterval = setInterval(() => doTime(), 1000);
// if you want to cancel this infinitely repeating function, call clearInterval()
// clearInterval(timeInterval)
<div>
Date: <span id='dateResult'></span>
</div>
<div>
Time: <span id='timeResult'></span>
</div>