Program Javascript untuk merubah huruf menjadi huruf kecil semua dan mengganti spasi

---

---

---

menjadi huruf kecil semua dan mengganti spasi dengan tanda hubung ("-"):

Tentu, berikut adalah kode JavaScript untuk mengubah string `tt` menjadi huruf kecil semua dan mengganti spasi dengan tanda hubung ("-"):

```javascript

var tt = "Desain Pagar Dan Kanopi Minimalis";

var ttLowercase = tt.toLowerCase(); // Mengubah ke huruf kecil semua

var ttWithDash = ttLowercase.replace(/\s+/g, "-"); // Mengganti spasi dengan tanda hubung

console.log(ttWithDash); // Output: "desain-pagar-dan-kanopi-minimalis"

```

Dalam kode di atas, `toLowerCase()` digunakan untuk mengubah semua huruf menjadi huruf kecil, dan `replace(/\s+/g, "-")` digunakan untuk mengganti spasi dengan tanda hubung. Hasilnya akan dicetak pada konsol sebagai "desain-pagar-dan-kanopi-minimalis".

Berikut adalah kode JavaScript lengkap yang mencakup pengambilan input dari textarea, pemrosesan string, dan kemampuan untuk menyalin hasil ke clipboard saat tombol diklik:

```html

    <textarea id="inputText" rows="4" cols="50" placeholder="Masukkan teks di sini..."></textarea>

    <button onclick="transformText()">Transform Text</button>

    <br>

    <span id="result"></span>

    <script>

        function transformText() {

            // Mendapatkan nilai dari textarea

            var tt = document.getElementById('inputText').value;

            // Mengubah ke huruf kecil semua dan mengganti spasi dengan tanda hubung

            var ttLowercase = tt.toLowerCase();

            var ttWithDash = ttLowercase.replace(/\s+/g, "-");

            // Menampilkan hasil di elemen dengan id "result"

            var resultElement = document.getElementById('result');

            resultElement.textContent = ttWithDash;

            // Menyalin hasil ke clipboard

            var textArea = document.createElement("textarea");

            textArea.value = ttWithDash;

            document.body.appendChild(textArea);

            textArea.select();

            document.execCommand('copy');

            document.body.removeChild(textArea);

            alert("Hasil telah disalin ke clipboard!");

        }

    </script>

```

Dalam kode di atas, kita menggunakan elemen textarea untuk mendapatkan input teks dari pengguna. Ketika tombol "Transform Text" ditekan, fungsi `transformText()` dijalankan. Fungsi ini melakukan pemrosesan string, menampilkan hasil, dan menyalin hasil ke clipboard. Hasilnya juga ditampilkan di elemen dengan id "result".

Berikut adalah kode JavaScript yang memunculkan tulisan di bawah tombol "Transform Text" selama 3 detik tanpa menggunakan alert:

```html

    <textarea id="inputText" rows="4" cols="50" placeholder="Masukkan teks di sini..."></textarea>

    <button onclick="transformText()">Transform Text</button>

    <br>

    <span id="result"></span>

    <script>

        function transformText() {

            // Mendapatkan nilai dari textarea

            var tt = document.getElementById('inputText').value;

            // Mengubah ke huruf kecil semua dan mengganti spasi dengan tanda hubung

            var ttLowercase = tt.toLowerCase();

            var ttWithDash = ttLowercase.replace(/\s+/g, "-");

            // Menampilkan hasil di elemen dengan id "result"

            var resultElement = document.getElementById('result');

            resultElement.textContent = ttWithDash;

            // Menyalin hasil ke clipboard

            var textArea = document.createElement("textarea");

            textArea.value = ttWithDash;

            document.body.appendChild(textArea);

            textArea.select();

            document.execCommand('copy');

            document.body.removeChild(textArea);

            // Menampilkan tulisan di bawah tombol selama 3 detik

            var messageElement = document.createElement("span");

            messageElement.textContent = "Hasil telah disalin ke clipboard!";

            document.body.appendChild(messageElement);

            setTimeout(function() {

                document.body.removeChild(messageElement);

            }, 3000);

        }

    </script>

```

Dalam kode di atas, pesan "Hasil telah disalin ke clipboard!" ditambahkan sebagai elemen `<span>`, dan elemen ini ditambahkan ke body dokumen. Kemudian, kita menggunakan `setTimeout` untuk menghapus elemen tersebut setelah 3 detik.