需要帮助使用秒、图像完成JavaScript时钟<；头>；，及<；部门>；_Javascript_Html_Clock_Seconds

需要帮助使用秒、图像完成JavaScript时钟<；头>；，及<；部门>；

javascript html

需要帮助使用秒、图像完成JavaScript时钟<；头>；，及<；部门>；,javascript,html,clock,seconds,Javascript,Html,Clock,Seconds,我对JavaScript的世界还是有点陌生。我有一个JS时钟，它使用图像来显示时间。我只是需要帮助完成一些事情。我试着在网上查找，但似乎找不到任何有用的东西。任何帮助都将不胜感激我似乎无法让“秒”功能工作。我从这里列出的代码中删除了它们，因为它会破坏JS的其余部分，并且不会让时钟显示出来我希望在该部分中使用一个按钮，以便稍后在页面上按住时钟。我不想要“div script/script/div” JS文件名：clock.JS 图像文件：名称：0.png-9.png、冒号-1.png（用于闪

我对JavaScript的世界还是有点陌生。我有一个JS时钟，它使用图像来显示时间。我只是需要帮助完成一些事情。我试着在网上查找，但似乎找不到任何有用的东西。任何帮助都将不胜感激

我似乎无法让“秒”功能工作。我从这里列出的代码中删除了它们，因为它会破坏JS的其余部分，并且不会让时钟显示出来

我希望在该部分中使用一个按钮，以便稍后在页面上按住时钟。我不想要“div script/script/div”

JS文件名：clock.JS

图像文件：名称：0.png-9.png、冒号-1.png（用于闪烁灯光）、冒号-2.png（用于闪烁灯光）、am.png、pm.png |大小：16x21

HTML页面：

<!DOCTYPE html>
<html>

<head>
 <script type="text/javascript" src="clock.js"></script>
</head>

<body>

<nav>
 <div id="clock"></div> <!-- where I want the clock JS to appear -->
 <!-- appears on the right side of the page 100px from the top -->
</nav>

</body>
</html>

JavaScript:

// creates array of all digit images
var digit = new Array()
digit[0] = new Image(16, 21)
digit[1] = new Image(16, 21)
digit[2] = new Image(16, 21)
digit[3] = new Image(16, 21)
digit[4] = new Image(16, 21)
digit[5] = new Image(16, 21)
digit[6] = new Image(16, 21)
digit[7] = new Image(16, 21)
digit[8] = new Image(16, 21)
digit[9] = new Image(16, 21)
digit[10] = new Image(16, 21) // AM
digit[11] = new Image(16, 21) // PM
digit[12] = new Image(9, 21) // Light ":"
digit[13] = new Image(9, 21) // Dark ":"

// Assigns sources to the digital images #0-9
for (var i = 0; i < 10; ++i) {digit[i].src = getPath(location.href) + "img/clock/" + i + ".png";}

// Assigns sources to the other image objects
digit[10].src = getPath(location.href) + "img/clock/am.png";
digit[11].src = getPath(location.href) + "img/clock/pm.png";
digit[12].src = getPath(location.href) + "img/clock/colon-1.png";
digit[13].src = getPath(location.href) + "img/clock/colon-2.png";


var hour1 = getHour (0);
var hour2 = getHour (1);
var minute1 = getMinute (0);
var minute2 = getMinute (1);
var ampm = getAmpm ();
var colon = false;
var start = document.images.length;
var openImage = "<img src=\"" + getPath(location.href) + "img/clock/";
var closeImage = ".png\">";

document.write(openImage + hour1 + closeImage);
document.write(openImage + hour2 + closeImage);
document.write(openImage + "C.gif\">"); //need to edit.
document.write(openImage + minute1 + closeImage);
document.write(openImage + minute2 + closeImage);
document.write(openImage + ((ampm == 10) ? "am" : "pm") + closeImage);

var timerID = null;
var timerRunning = false;

update ();

function setClock() {

    if (getHour (0) != hour1) {hour1 = getHour(0); document.images[start].src = digit[hour1].src;}
    if (getHour (1) != hour2) {hour2 = getHour(1); document.images[start + 1].src = digit[hour2].src;}

    colon = !colon

    if (!colon) document.images[start + 2].src = digit[13].src
    else document.images[start + 2].src = digit[12].src
    if (getMinute (0) != minute1) {minute1 = getMinute(0); document.images[start + 3].src = digit[minute1].src;}
    if (getMinute (1) != minute2) {minute2 = getMinute(1); document.images[start + 4].src = digit[minute2].src;}
    if (getAmpm () != ampm) {ampm = getAmpm(); document.images[start + 5].src = digit[ampm].src;}

    timerID = setTimeout("setClock()",1000);

 timerRunning = true;
}

function update () {
 stopClock ();
 setClock ();
}

// do not change these numbers
function getHour (place) {
 var now = new Date ();
 var hour = now.getHours ();

    if (hour >= 12) hour -= 12
    hour = (hour == 0) ? 12 : hour

    if (hour < 10) hour = "0" + hour

    hour += "";

    return parseInt (hour.charAt (place));
}

// do not change these numbers
function getMinute(place) {
    var now = new Date()
    var minute = now.getMinutes()
    if (minute < 10) minute = "0" + minute
    minute += "";
    return parseInt(minute.charAt(place));
}

// "return 10" = am, "return 11" = pm
function getAmpm () {
 var now = new Date ();
 var hour = now.getHours ();
 if (hour >= 12) return 11; return 10
}

function getPath (url) {
 lastSlash = url.lastIndexOf ("/");
 return url.substring (0, lastSlash + 1);
}

// Stops the clock if this is not present
function stopClock () {
 if (timerRunning); clearTimeout (timerID);
 timerRunning = false;
}

//创建所有数字图像的数组
var digit=新数组（）
数字[0]=新图像（16,21）
数字[1]=新图像（16,21）
数字[2]=新图像（16,21）
数字[3]=新图像（16,21）
数字[4]=新图像（16,21）
数字[5]=新图像（16,21）
数字[6]=新图像（16,21）
数字[7]=新图像（16,21）
数字[8]=新图像（16,21）
数字[9]=新图像（16,21）
数字[10]=新图像（16,21）//AM
数字[11]=新图像（16,21）//PM
数字[12]=新图像（9,21）//灯光“：
数字[13]=新图像（9,21）//暗“：
//将源指定给数字图像#0-9
对于（var i=0；i<10；++i）{digit[i].src=getPath（location.href）+“img/clock/”+i+.png”；}
//将源指定给其他图像对象
数字[10].src=getPath（location.href）+“img/clock/am.png”；
数字[11].src=getPath（location.href）+“img/clock/pm.png”；
数字[12]。src=getPath（location.href）+“img/clock/colon-1.png”；
数字[13].src=getPath（location.href）+“img/clock/colon-2.png”；
var hour1=getHour（0）；
var hour2=getHour（1）；
var minute1=getMinute（0）；
var minute2=getMinute（1）；
var-ampm=getAmpm（）；
var冒号=假；
var start=document.images.length；
var openImage=“”；
document.write（openImage+hour1+closeImage）；
document.write（openImage+hour2+closeImage）；
document.write（openImage+“C.gif\”>”；//需要编辑。
document.write（openImage+minute1+closeImage）；
document.write（openImage+minute2+closeImage）；
文件写入（openImage+（（ampm==10）？“am”：“pm”）+closeImage）；
var-timerID=null；
var timerRunning=错误；
更新（）；
函数setClock（）{
if（getHour（0）！=hour1）{hour1=getHour（0）；document.images[start].src=digit[hour1].src；}
if（getHour（1）！=hour2）{hour2=getHour（1）；document.images[start+1].src=digit[hour2].src；}
冒号=！冒号
如果（！冒号）document.images[start+2].src=数字[13].src
else document.images[start+2].src=数字[12].src
if（getMinute（0）！=minute1）{minute1=getMinute（0）；document.images[start+3].src=digit[minute1].src；}
if（getMinute（1）！=minute2）{minute2=getMinute（1）；document.images[start+4].src=digit[minute2].src；}
if（getAmpm（）！=ampm）{ampm=getAmpm（）；document.images[start+5].src=digit[ampm].src；}
timerID=setTimeout（“setClock（）”，1000）；
timerRunning=true；
}
函数更新（）{
秒钟（）；
setClock（）；
}
//不要改变这些数字
功能时间（地点）{
var now=新日期（）；
var hour=now.getHours（）；
如果（小时>=12）小时-=12
小时=（小时==0）？12：小时
如果（小时<10）小时=“0”+小时
小时+=”；
返回parseInt（hour.charAt（place））；
}
//不要改变这些数字
功能：分钟（地点）{
var now=新日期（）
var minute=now.getMinutes（）
如果（分钟<10）分钟=“0”+分钟
分钟+=”；
返回parseInt（分钟字符（位置））；
}
//“返回10”=上午，“返回11”=下午
函数getAmpm（）{
var now=新日期（）；
var hour=now.getHours（）；
如果（小时>=12）返回11；返回10
}
函数getPath（url）{
lastSlash=url.lastIndexOf（“/”）；
返回url.substring（0，lastSlash+1）；
}
//如果不存在，则停止时钟
功能停止时钟（）{
if（timerRunning）；clearTimeout（timerID）；
timerRunning=false；
}

我使用了您的代码并修改为：

<html>
<body>

<div id="clock" style="position:absolute;float:right;top:100px;right:0px;">

<script>
// creates array of all digit images
var digit = new Array();
digit[0] = new Image(16, 21);
digit[1] = new Image(16, 21);
digit[2] = new Image(16, 21);
digit[3] = new Image(16, 21);
digit[4] = new Image(16, 21);
digit[5] = new Image(16, 21);
digit[6] = new Image(16, 21);
digit[7] = new Image(16, 21);
digit[8] = new Image(16, 21);
digit[9] = new Image(16, 21);
digit[10] = new Image(16, 21); // AM
digit[11] = new Image(16, 21); // PM
digit[12] = new Image(9, 21); // Light ":"
digit[13] = new Image(9, 21); // Dark ":"

// Assigns sources to the digital images #0-9
for (var i = 0; i < 10; ++i) {
    digit[i].src = getPath(location.href) + "img/clock/" + i + ".png";
}

// Assigns sources to the other image objects
digit[10].src = getPath(location.href) + "img/clock/am.png";
digit[11].src = getPath(location.href) + "img/clock/pm.png";
digit[12].src = getPath(location.href) + "img/clock/colon-1.png";
digit[13].src = getPath(location.href) + "img/clock/colon-2.png";

var hour1 = getHour (0);
var hour2 = getHour (1);
var minute1 = getMinute (0);
var minute2 = getMinute (1);
var ampm = getAmpm ();
var colon = false;

// get array substring of first clock image in document.images array
// number of images in document
var start = document.images.length;

// displays initial clock
var openImage = "<img src=\"" + getPath(location.href) + "img/clock/";
var closeImage = ".png\">";

document.write(openImage + hour1 + closeImage);
document.write(openImage + hour2 + closeImage);
document.write(openImage + "colon-1.png\">"); //need to edit.
document.write(openImage + minute1 + closeImage);
document.write(openImage + minute2 + closeImage);
document.write(openImage + ((ampm == 10) ? "am" : "pm") + closeImage);

var timerID = null;
var timerRunning = false;

update ();

function setClock() {

    if (getHour(0) != hour1) {
        hour1 = getHour(0);
        document.images[start].src = digit[hour1].src;
    }

    if (getHour(1) != hour2) {
        hour2 = getHour(1);
        document.images[start + 1].src = digit[hour2].src;
    }

    colon = !colon;

    if (!colon)
        document.images[start + 2].src = digit[13].src;
    else
        document.images[start + 2].src = digit[12].src;

    if (getMinute(0) != minute1) {
        minute1 = getMinute(0);
        document.images[start + 3].src = digit[minute1].src;
    }

    if (getMinute(1) != minute2) {
        minute2 = getMinute(1);
        document.images[start + 4].src = digit[minute2].src;
    }

    if (getAmpm() != ampm) {
        ampm = getAmpm();
        document.images[start + 5].src = digit[ampm].src;
    }

    timerID = setTimeout("setClock()",1000);

    timerRunning = true;
}

function update () {
 stopClock ();
 setClock ();
}

// do not change these numbers
function getHour (place) {
 var now = new Date ();
 var hour = now.getHours ();

    if (hour >= 12)
        hour -= 12;
    hour = (hour == 0) ? 12 : hour;

    if (hour < 10)
        hour = "0" + hour;

    hour += "";

    return parseInt (hour.charAt (place));
}

// do not change these numbers
function getMinute(place) {
    var now = new Date();
    var minute = now.getMinutes();
    if (minute < 10) 
        minute = "0" + minute;
    minute += "";
    return parseInt(minute.charAt(place));
}

// "return 10" = am, "return 11" = pm
function getAmpm () {
 var now = new Date ();
 var hour = now.getHours ();
 if (hour >= 12)
    return 11;
 return 10;
}

function getPath (url) {
 //lastSlash = url.lastIndexOf ("/");
 //return url.substring (0, lastSlash + 1);
 return "";
}

// Stops the clock if this is not present
function stopClock () {
 if (timerRunning) clearTimeout (timerID);
 timerRunning = false;
}

</script>
</div> 
</body>
</html>


//创建所有数字图像的数组
var digit=新数组（）；
数字[0]=新图像（16,21）；
数字[1]=新图像（16,21）；
数字[2]=新图像（16,21）；
数字[3]=新图像（16,21）；
数字[4]=新图像（16,21）；
数字[5]=新图像（16,21）；
数字[6]=新图像（16,21）；
数字[7]=新图像（16,21）；
数字[8]=新图像（16,21）；
数字[9]=新图像（16,21）；
数字[10]=新图像（16,21）；//AM
数字[11]=新图像（16,21）；//PM
数字[12]=新图像（9,21）；//灯光“：
数字[13]=新图像（9,21）；//暗“：
//将源指定给数字图像#0-9
对于（变量i=0；i<10；++i）{
数字[i].src=getPath（location.href）+“img/clock/”+i+.png”；
}
//将源指定给其他图像对象
数字[10].src=getPath（location.href）+“img/clock/am.png”；
数字[11].src=getPath（location.href）+“img/clock/pm.png”；
数字[12]。src=getPath（location.href）+“img/clock/colon-1.png”；
数字[13].src=getPath（location.href）+“img/clock/colon-2.png”；
var hour1=getHour（0）；
var hour2=getHour（1）；
var minute1=getMinute（0）；
var minute2=getMinute（1）；
var-ampm=getAmpm（）；
var冒号=假；
//获取document.images数组中第一个时钟映像的数组子字符串
//文档中的图像数
var start=document.images.length；
//显示初始时钟
var openImage=“”；
document.write（openImage+hour1+closeImage）；
document.write（openImage+hour2+closeImage）；
document.write（openImage+“colon-1.png\”>）//需要编辑。
document.write（openImage+minute1+closeImage）；
document.write（openImage+minute2+closeImage）；
文件写入（openImage+（（ampm==10）？“am”：“pm”）+closeImage）；
var-timerID=null；
var timerRunning=错误；
更新（）；
函数setClock（）{
如果（getHour（0）！=小时1）{
hour1=getHour（0）；
document.images[start].src=数字[h]