.
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.