Rumah > hujung hadapan web > tutorial js > Kesan hitung detik JavaScript pelaksanaan_kemahiran javascript

Kesan hitung detik JavaScript pelaksanaan_kemahiran javascript

WBOY
Lepaskan: 2016-05-16 15:32:47
asal
1287 orang telah melayarinya

Artikel ini menganalisis idea pengiraan dan kaedah kesan kira detik yang berbeza, menguasai objek tarikh Tarikh, kaedah mendapatkan masa dan kaedah mengira perbezaan masa untuk mencapai kesan kira detik yang berbeza.

1. Paparan masa yang ringkas

Terangkan objek tarikh Tarikh, dan dapatkan jam, minit, saat, dsb. melalui objek ini, membolehkan anda mengekstrak kandungan masa yang diperlukan secara bebas.

<!DOCTYPE html>
<html>
<head>
  <title>获取时间</title>
  <script type="text/javascript">
  window.onload = function(){
    showTime();
  }

  function showTime(){
    var myDate = new Date();
    var year = myDate.getFullYear();
    var month = myDate.getMonth() + 1;
    var date = myDate.getDate();
    var dateArr = ["日","一",'二','三','四','五','六'];
    var day = myDate.getDay();
    var hours = myDate.getHours();
    var minutes = formatTime(myDate.getMinutes());
    var seconds = formatTime(myDate.getSeconds());

    var systemTime = document.getElementById("time");
    systemTime.innerHTML = " " + year + "年" + month +"月" + date + "日" + " 星期" + dateArr[day] + " " + hours + ":" + minutes + ":" + seconds;
    setTimeout("showTime()",500);
  }

  //格式化时间:分秒。
  function formatTime (i){
    if(i < 10){
      i = "0" + i;
    }
    return i;
  }

  </script>
</head>
<body>
  <div id ='time'></div>
</body>
</html>
Salin selepas log masuk

Hasil paparan:

2. Perbezaan masa kira detik

Terangkan kaedah seperti gettime() dan cara mengira masa, serta pelajari bilangan hari antara masa.

<!DOCTYPE html>
<html>
<head>
  <title>获取时间</title>
  <script type="text/javascript">
    window.onload = function(){
      deadTime();
    }
    function deadTime(){
      var nowTime = new Date();
      var finalTime = new Date("2015-11-11");
      var lefttime = (finalTime.getTime() - nowTime.getTime())/(1000*24*60*60);
      var date = Math.ceil(lefttime);
      document.getElementById("time").innerHTML = date;
    }
  </script>
</head>
<body>
  <div >距离双十一还有:<span id ='time'></span>天</div>
</body>
</html>

Salin selepas log masuk

Kesan paparan:

3. Jualan masa terhad

Cara menggunakan objek tarikh dan kaedah untuk mengira perbezaan hari, jam, minit dan saat.

<!DOCTYPE html>
<html>
<head>
<title>团购——限时抢</title>

</head>

<body>

<div class="time"> <span id="LeftTime"></span></div>
</div>
<script>
function FreshTime()
{
    var endtime=new Date("2015/11/11,12:20:12");//结束时间
    var nowtime = new Date();//当前时间
    var lefttime=parseInt((endtime.getTime()-nowtime.getTime())/1000); 
    d=parseInt(lefttime/3600/24);
    h=parseInt((lefttime/3600)%24);
    m=parseInt((lefttime/60)%60);
    s=parseInt(lefttime%60);

    document.getElementById("LeftTime").innerHTML="距离活动结束还剩" + d+"天"+h+"小时"+m+"分"+s+"秒";
    if(lefttime<=0){
        document.getElementById("LeftTime").innerHTML="团购已结束";
        clearInterval(sh);
    }
}
    FreshTime();
    var sh;
    sh=setInterval(FreshTime,1000);
</script>
</body>
</html>
Salin selepas log masuk

Kesan paparan:

Mata pengetahuan:

1. Belajar menggunakan objek dan kaedah tarikh.
2. Belajar untuk mendapatkan kandungan pada masa yang berbeza.
3. Ketahui cara mengira perbezaan masa.

Artikel ini memperkenalkan beberapa kesan kira detik biasa, yang amat sesuai digunakan dalam aktiviti tergesa-gesa kira detik seperti tapak web membeli kumpulan hari ini, tapak web e-dagang, portal, dll. Saya harap artikel ini dapat membantu semua orang menguasai pelaksanaan kira detik JavaScript kesan.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan