Bagaimana untuk Melaksanakan Pemformatan Paparan Masa Stack Exchange dalam JavaScript?

Patricia Arquette
Lepaskan: 2024-11-08 09:03:02
asal
239 orang telah melayarinya

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";
}
Salin selepas log masuk

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"
Salin selepas log masuk

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!

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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!