Langsung ke konten utama

JS Menampilkan Tanggal Format Indonesia

Berikut ini merupakan kode untuk tanggalnya.

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title>Menampilkan Tanggal Besok dengan Format Tertentu</title>

  </head>

  <body>

    <h1>Tanggal Besok:</h1>

    <p id="tanggal-besok"></p>


    <script>

      var hari = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'];

      var bulan = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];


      var today = new Date();

      var tomorrow = new Date(today);

      tomorrow.setDate(tomorrow.getDate() + 1);


      var namaHariBesok = hari[tomorrow.getDay()];

      var tanggalBesok = tomorrow.getDate();

      var namaBulanBesok = bulan[tomorrow.getMonth()];

      var tahunBesok = tomorrow.getFullYear();


      var tanggalBesokFormat = namaHariBesok + ', ' + tanggalBesok + ' ' + namaBulanBesok + ' ' + tahunBesok;


      document.getElementById("tanggal-besok").innerHTML = tanggalBesokFormat;

    </script>

  </body>

</html>

Pada Contoh Kode di atas merupakan kode untuk menampilkan kode di hari selanjutnya, jika kalian ingin menampilkan tanggal untuk hari ini maka kalian bisa perhatikan pada bagian kode ini:

tomorrow.setDate(tomorrow.getDate() + 1);

Kalian hanya perlu menghapus pada + 1 maka akan menampilkan tanggal pada hari ini, contohnya sebagai berikut.

tomorrow.setDate(tomorrow.getDate());

Menambahkan fungsi Tombol Untuk Menampilkan


<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title>Menampilkan Tanggal Besok dengan Format Tertentu</title>

  </head>

  <body>

    <h1>Tanggal Besok:</h1>

    <button onclick="tampilkanTanggal()">Hasil</button>

    <p id="tanggal-besok" style="display:none;"></p>


    <script>

      var hari = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'];

      var bulan = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];


      function tampilkanTanggal() {

        var today = new Date();

        var tomorrow = new Date(today);

        tomorrow.setDate(tomorrow.getDate() + 1);


        var namaHariBesok = hari[tomorrow.getDay()];

        var tanggalBesok = tomorrow.getDate();

        var namaBulanBesok = bulan[tomorrow.getMonth()];

        var tahunBesok = tomorrow.getFullYear();


        var tanggalBesokFormat = namaHariBesok + ', ' + tanggalBesok + ' ' + namaBulanBesok + ' ' + tahunBesok;


        var elTanggalBesok = document.getElementById("tanggal-besok");

        elTanggalBesok.innerHTML = tanggalBesokFormat;

        elTanggalBesok.style.display = "block";

      }

    </script>

  </body>

</html>

Berikut adalah contoh kode HTML dan JavaScript yang menambahkan ID "sekarang" dan mengganti ID "sekarang" dengan ID "tanggal-besok" ketika tombol "hasil" ditekan:




<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Menampilkan Tanggal Besok dengan Format Tertentu</title>
  </head>
  <body>
    <h1>Tanggal:</h1>
    <p id="sekarang">Sekarang: <script>document.write(new Date().toLocaleString());</script></p>
    <p id="tanggal-besok" style="display:none;"></p>
    <button onclick="tampilkanTanggal()">Hasil</button>

    <script>
      var hari = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'];
      var bulan = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];

      function tampilkanTanggal() {
        var today = new Date();
        var tomorrow = new Date(today);
        tomorrow.setDate(tomorrow.getDate() + 1);

        var namaHariBesok = hari[tomorrow.getDay()];
        var tanggalBesok = tomorrow.getDate();
        var namaBulanBesok = bulan[tomorrow.getMonth()];
        var tahunBesok = tomorrow.getFullYear();

        var tanggalBesokFormat = namaHariBesok + ', ' + tanggalBesok + ' ' + namaBulanBesok + ' ' + tahunBesok;

        var elSekarang = document.getElementById("sekarang");
        var elTanggalBesok = document.getElementById("tanggal-besok");

        elSekarang.style.display = "none";
        elTanggalBesok.innerHTML = tanggalBesokFormat;
        elTanggalBesok.style.display = "block";
      }
    </script>
  </body>
</html>

Kode di atas mengubah HTML dengan menambahkan ID "sekarang" pada elemen yang menampilkan tanggal sekarang. Kemudian pada fungsi tampilkanTanggal(), kita mengambil elemen dengan ID "sekarang" dan mengubah nilai properti display pada CSS menjadi "none" agar elemen tersebut disembunyikan. Kemudian, kita mengambil elemen dengan ID "tanggal-besok" dan mengubah nilai properti display menjadi "block" agar elemen tersebut ditampilkan. Dengan cara ini, ketika tombol "hasil" ditekan, ID "sekarang" akan dihilangkan dan diganti dengan ID "tanggal-besok".

Berikut adalah contoh kode HTML dan JavaScript yang dapat menampilkan bergantian ID "sekarang" dan "tanggal-besok" ketika tombol "hasil" ditekan:

<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title>Menampilkan Tanggal Besok dengan Format Tertentu</title>

  </head>

  <body>

    <h1>Tanggal:</h1>

    <p id="sekarang">Sekarang: <script>document.write(new Date().toLocaleString());</script></p>

    <p id="tanggal-besok" style="display:none;"></p>

    <button onclick="tampilkanTanggal()">Hasil</button>


    <script>

      var hari = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'];

      var bulan = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];


      function tampilkanTanggal() {

        var today = new Date();

        var tomorrow = new Date(today);

        tomorrow.setDate(tomorrow.getDate() + 1);


        var namaHariBesok = hari[tomorrow.getDay()];

        var tanggalBesok = tomorrow.getDate();

        var namaBulanBesok = bulan[tomorrow.getMonth()];

        var tahunBesok = tomorrow.getFullYear();


        var tanggalBesokFormat = namaHariBesok + ', ' + tanggalBesok + ' ' + namaBulanBesok + ' ' + tahunBesok;


        var elSekarang = document.getElementById("sekarang");

        var elTanggalBesok = document.getElementById("tanggal-besok");


        if (elSekarang.style.display === "block") {

          elSekarang.style.display = "none";

          elTanggalBesok.innerHTML = tanggalBesokFormat;

          elTanggalBesok.style.display = "block";

        } else {

          elSekarang.style.display = "block";

          elTanggalBesok.style.display = "none";

        }

      }

    </script>

  </body>

</html>

Label:

Postingan populer dari blog ini

3 Cara Otomatis Replace index.php di Linux Ubuntu: Systemd, Cron, dan Shell Loop

Ada beberapa cara untuk membuat Linux Ubuntu otomatis mengganti atau memperbarui file: /var/www/html/index.php secara berkala dari script lokal. Tiga metode yang paling umum adalah: Systemd Service + Timer Cron Shell Loop + nohup Di bawah ini adalah contoh implementasinya. 1. Menggunakan Systemd Service + Timer Metode ini paling cocok untuk VPS atau server Ubuntu normal yang menggunakan systemd . Buat script update sudo nano /usr/local/bin/update-index.sh Isi: #!/bin/sh cat > /var/www/html/index.php <<'EOF' <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Website</title> </head> <body> <h1>INDEX OTOMATIS</h1> </body> </html> EOF Beri permission execute: sudo chmod +x /usr/local/bin/update-index.sh Buat service sudo nano /etc/systemd/system/update-index.service Isi: [Unit] Description=Update index.php [Service] Type=oneshot ExecStart=/usr/local...
Read more »

Tutorial Dasar GSocket dan gs-netcat di Windows dan Ubuntu

GSocket atau Global Socket Toolkit adalah kumpulan tool yang memungkinkan dua komputer membuat koneksi TCP melalui Global Socket Relay Network (GSRN) . Salah satu tool di dalamnya adalah gs-netcat . Berbeda dengan koneksi TCP tradisional yang biasanya membutuhkan alamat IP dan port tujuan, GSocket memungkinkan dua endpoint saling menemukan berdasarkan sebuah shared secret . Koneksi antarendpoint kemudian dapat dilindungi dengan enkripsi end-to-end. Gambaran Cara Kerja Secara sederhana: Windows | | outbound connection v Global Socket Relay Network ^ | outbound connection | Ubuntu Artinya Ubuntu tidak harus membuka sebuah port publik khusus agar endpoint GSocket dapat berkomunikasi. Ini berbeda dengan SSH langsung: Windows | | SSH v IP Ubuntu:22 Pada SSH biasa, Windows harus mengetahui IP atau domain server serta port SSH yang dapat dijangkau. Apakah gs-netcat Tersedia di Windows? Ya. GSocket menyediakan gs-netcat yang dapat digunaka...
Read more »