Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Melaksanakan Pemformatan Paparan Masa Stack Exchange dalam JavaScript?

Bagaimana untuk Melaksanakan Pemformatan Paparan Masa Stack Exchange dalam JavaScript?

Patricia Arquette
Patricia Arquetteasal
2024-11-08 09:03:02302semak imbas

How to Implement Stack Exchange's Time Display Formatting in JavaScript?

Memformat Masa Sejak: Meniru Paparan Masa Stack Exchange

Keperluan untuk memaparkan masa berlalu sejak titik masa tertentu adalah perkara biasa dalam aplikasi web . Banyak tapak web popular, seperti Stack Exchange, menggunakan format ringkas dan bermaklumat untuk memaparkan masa sejak, seperti "4 minit lalu" atau "1 tahun lalu." Melaksanakan kaedah pemformatan yang serupa dalam JavaScript membolehkan pembangun menyediakan cara yang mesra pengguna dan intuitif untuk merujuk peristiwa lalu.

Untuk mencapai matlamat ini, kami boleh memanfaatkan objek Tarikh terbina dalam JavaScript dan pengiraan mudah untuk menentukan masa berlalu. masa antara dua tarikh.

Pelaksanaan:

function timeSince(date) {
  var seconds = Math.floor((new Date() - date) / 1000);

  var interval = seconds / 31536000;

  if (interval > 1) {
    return Math.floor(interval) + " years";
  }
  interval = seconds / 2592000;
  if (interval > 1) {
    return Math.floor(interval) + " months";
  }
  interval = seconds / 86400;
  if (interval > 1) {
    return Math.floor(interval) + " days";
  }
  interval = seconds / 3600;
  if (interval > 1) {
    return Math.floor(interval) + " hours";
  }
  interval = seconds / 60;
  if (interval > 1) {
    return Math.floor(interval) + " minutes";
  }
  return Math.floor(seconds) + " seconds";
}

Penggunaan:

var aDay = 24 * 60 * 60 * 1000;
console.log(timeSince(new Date(Date.now() - aDay))); // "1 day ago"
console.log(timeSince(new Date(Date.now() - aDay * 2))); // "2 days ago"

Fungsi ini mengira perbezaan antara arus masa dan tarikh tertentu, dan kemudian memformatkannya sebagai rentetan berdasarkan masa berlalu, antara saat hingga tahun. Fungsi ini beroperasi dengan membahagikan masa berlalu dengan pelbagai selang dan membulatkan hasilnya kepada integer terdekat.

Dengan melaksanakan kaedah ini, pembangun boleh memaparkan masa berlalu dengan mudah dalam format yang konsisten dan mesra pengguna, meningkatkan pengalaman pengguna aplikasi web mereka.

Atas ialah kandungan terperinci Bagaimana untuk Melaksanakan Pemformatan Paparan Masa Stack Exchange dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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