[iklan]

Aplikasi Hapus Inline Style dan Class

Kode ini merupakan sebuah alat sederhana untuk menghapus atribut style dari elemen HTML yang dimasukkan ke dalam textarea

2. HTML (Tampilan Input & Output)

πŸ“Œ Fungsi:

  • <textarea id="inputText"> → Tempat memasukkan teks HTML yang ingin diproses.
  • Button "Hapus Style" → Menjalankan fungsi processText(), yang akan menghapus style="" dari teks.
  • <textarea id="outputText" readonly> → Menampilkan hasil tanpa atribut style, dalam keadaan read-only agar tidak bisa diedit.
  • Button "Copy" → Menjalankan fungsi copyToClipboard(), yang menyalin hasil ke clipboard.

Input HTML:

Output:

πŸ”Ή Struktur & Fungsinya

1. CSS (Bagian <style>):

πŸ“Œ Fungsi:

  • width: 100% → Agar textarea mengisi seluruh lebar kontainer.
  • height: 150px → Menentukan tinggi textarea.
  • margin-bottom: 10px → Memberikan jarak antar elemen.

3. JavaScript (Proses Penghapusan style & Copy ke Clipboard)

πŸ“Œ Fungsi:

  • Mengambil teks dari #inputText.
  • Menggunakan replace(/style="[^"]*"/g, "") untuk menghapus atribut style="...".
  • Menampilkan hasil di #outputText.

πŸ“Œ Fungsi:

  • Memilih teks output (outputText.select()).
  • Menyalin teks ke clipboard (document.execCommand("copy")).
  • Menampilkan alert setelah berhasil menyalin.

Keunggulan Kode Ini

Mudah digunakan – cukup masukkan teks HTML dan klik tombol.
Bekerja untuk semua elemen HTML yang memiliki style.
Dapat disalin langsung ke clipboard dengan sekali klik.

πŸ”₯ Kesimpulan: Kode ini berguna bagi siapa saja yang ingin membersihkan atribut style dari kode HTML dengan cepat dan praktis. πŸš€



Input HTML:

Output:

0 comments:

Posting Komentar

Catatan Sementara

 
© - Catatan Afandi Kusuma | Buku.suwur | Furniture.Omasae | JayaSteel | OmaSae | Alat Pesta + Wedding | Galvalum | DepoAirIsiUlang | Seluruh Arsip