js如何製作網頁時鐘（js怎麼做動態時鐘）

本文目錄一覽：

• 1、製作頁面時鐘，在頁面內顯示當前時間，並使用計時器控制時間的變化用JAVASCRIPT
• 2、如何用javascript實現一個時鐘？
• 3、怎麼用js讓網頁顯示時間
• 4、怎麼把js時鐘放在網頁側邊
• 5、javascript,實現一個時鐘,頁面顯示當前時間包括年月日時 分 秒 並設定一個時間點，當該
• 6、網頁製作中時間和日期怎麼加。

製作頁面時鐘，在頁面內顯示當前時間，並使用計時器控制時間的變化用JAVASCRIPT

// JavaScript Document

function disptime(){

var today=new Date();

var hh=today.getHours();

var mm=today.getMinutes();

var ss=today.getSeconds();

document.getElementById(“myClock”).innerHTML=”h1現在的時間是：”+hh+”:”+mm+”:”+ss+”h1″;

}

var timer;

function interval(){

timer=setInterval(“disptime()”,1000);

}

在html文件中引入和加載就好了，引入總會的吧。

如何用javascript實現一個時鐘？

function init(){

  clock();

  setInterval(clock,1000);

}

function clock(){

  var now = new Date();

  var ctx = document.getElementById(‘canvas’).getContext(‘2d’);

  ctx.save();

  ctx.clearRect(0,0,150,150);

  ctx.translate(75,75);

  ctx.scale(0.4,0.4);

  ctx.rotate(-Math.PI/2);

  ctx.strokeStyle = “black”;

  ctx.fillStyle = “white”;

  ctx.lineWidth = 8;

  ctx.lineCap = “round”;

  // Hour marks

  ctx.save();

  for (var i=0;i12;i++){

    ctx.beginPath();

    ctx.rotate(Math.PI/6);

    ctx.moveTo(100,0);

    ctx.lineTo(120,0);

    ctx.stroke();

  }

  ctx.restore();

  // Minute marks

  ctx.save();

  ctx.lineWidth = 5;

  for (i=0;i60;i++){

    if (i%5!=0) {

      ctx.beginPath();

      ctx.moveTo(117,0);

      ctx.lineTo(120,0);

      ctx.stroke();

    }

    ctx.rotate(Math.PI/30);

  }

  ctx.restore();

  var sec = now.getSeconds();

  var min = now.getMinutes();

  var hr  = now.getHours();

  hr = hr=12 ? hr-12 : hr;

  ctx.fillStyle = “black”;

  // write Hours

  ctx.save();

  ctx.rotate( hr*(Math.PI/6) + (Math.PI/360)*min + (Math.PI/21600)*sec )

  ctx.lineWidth = 14;

  ctx.beginPath();

  ctx.moveTo(-20,0);

  ctx.lineTo(80,0);

  ctx.stroke();

  ctx.restore();

  // write Minutes

  ctx.save();

  ctx.rotate( (Math.PI/30)*min + (Math.PI/1800)*sec )

  ctx.lineWidth = 10;

  ctx.beginPath();

  ctx.moveTo(-28,0);

  ctx.lineTo(112,0);

  ctx.stroke();

  ctx.restore();

  // Write seconds

  ctx.save();

  ctx.rotate(sec * Math.PI/30);

  ctx.strokeStyle = “#D40000”;

  ctx.fillStyle = “#D40000”;

  ctx.lineWidth = 6;

  ctx.beginPath();

  ctx.moveTo(-30,0);

  ctx.lineTo(83,0);

  ctx.stroke();

  ctx.beginPath();

  ctx.arc(0,0,10,0,Math.PI*2,true);

  ctx.fill();

  ctx.beginPath();

  ctx.arc(95,0,10,0,Math.PI*2,true);

  ctx.stroke();

  ctx.fillStyle = “#555”;

  ctx.arc(0,0,3,0,Math.PI*2,true);

  ctx.fill();

  ctx.restore();

  ctx.beginPath();

  ctx.lineWidth = 14;

  ctx.strokeStyle = ‘#325FA2’;

  ctx.arc(0,0,142,0,Math.PI*2,true);

  ctx.stroke();

  ctx.restore();

}

怎麼用js讓網頁顯示時間

$(function(){

function getTime(){

var date=new Date();

var time=date.getHours()+”:”+date.getMinutes()+”:”+date.getSeconds();

$(‘div’).html(time);

}

setInterval(getTime, 1000)

});

頁面中放一個div顯示時間

怎麼把js時鐘放在網頁側邊

1、首先打開電腦。

2、其次在電腦主頁找到並點擊設置。

3、最後在設置中點擊時鐘設置，點擊側面即可。

javascript,實現一個時鐘,頁面顯示當前時間包括年月日時 分 秒 並設定一個時間點，當該

html

head

titleTime/title

/head

body

div id=”time”/div

div id=”alert”/div

/body

script type=”text/javascript” charset=”utf-8″ async defer

var time = document.getElementById(“time”);

showTime();

function showTime() {

// To get the date time

var date = new Date();

var year = date.getYear() + 1900;

var month = date.getMonth() + 1;

var day = date.getDate();

var hour = date.getHours();

var min = date.getMinutes();

var sec = date.getSeconds();

var date_time = year + “-” + month + “-” + day + ” ” + hour + “:” + min + “:” + sec;

time.innerHTML = date_time;

// when the time is equal your condition, show the special words.

if(date_time == “2014-6-25 11:45:20”) {

document.getElementById(“alert”).innerHTML = “It’s time to display your words here.”;

}

}

// set the interval time

setInterval(showTime, 1000);

/script

/html

網頁製作中時間和日期怎麼加。

添加的具體方法如下：

1、打開Dreamweaver新建一個html網頁。

2、切換到代碼視圖，在head/head標籤里，title/title標籤後面輸入JavaScript標籤。  script type=”text/javascript”/script

3、在script標籤里定義一個time()函數

function time()

{

thistime=new Date()                                   //創建一個對象

var hours=thistime.getHours()                    //獲取時鐘

var minutes=thistime.getMinutes()             //獲取分鐘

var seconds=thistime.getSeconds()              //獲取秒鐘

var years=thistime.getYear()                         //獲取年

var months=thistime.getMonth()                //獲取月

var days=thistime.getDay()                          獲取日

}

4、判斷當時鐘小於10的時候在前面加個0，例如8點零8分會顯示08：08

if(eval(hours)10)

{

hours=”0″+hours

}

if(eval(minutes10))

{

minutes=”0″+minutes

}

if(seconds10)

{

seconds=”0″+seconds

5、thistime=hours+”:”+minutes+”:”+seconds     //把時間顯示順序調整好

document.title=thistime                                //在標題顯示

var timer=setTimeout(“time()”,1000)              //設置計時器，讓時間每分每秒更新

6、在body/body標籤加上加載觸發事件

body onload=”time()”

7、按Ctrl+s保存，按F12在瀏覽器中瀏覽。