Cara Mudah Menghapus Style dan Class dari HTML Menggunakan JavaScript

Input HTML:

Output:

Cara Mudah Menghapus Style dan Class dari HTML Menggunakan JavaScript
📖 Penjelasan:

Kadang saat kita menyalin teks dari website atau editor HTML, sering kali ada banyak atribut style dan class yang tidak kita butuhkan. Hal ini bisa membuat HTML jadi berat, berantakan, atau tidak sesuai dengan tampilan yang kita inginkan.

Pada tutorial kali ini, saya bagikan contoh kode sederhana menggunakan HTML dan JavaScript untuk:

    Menghapus semua atribut style dan class dari elemen HTML.

    Menampilkan hasil HTML yang bersih di textarea output.

    Sekaligus otomatis menyalin hasilnya ke clipboard agar bisa langsung dipaste ke tempat lain.

Fitur ini sangat berguna untuk:

    Membersihkan HTML hasil copy-paste dari Word atau editor online.

    Menyiapkan HTML sebelum dipasang di website tanpa CSS bawaan.

    Memudahkan proses editing atau konversi konten.

Fungsi utamanya:

    Ambil teks HTML dari textarea input.

    Parsing HTML menggunakan elemen div sementara.

    Loop semua elemen di dalamnya untuk menghapus atribut style dan class.

    Tampilkan hasil bersihnya di textarea output.

    Salin otomatis ke clipboard.

Cukup klik tombol "Hapus Style & Class", dan HTML kamu siap dipakai tanpa atribut tambahan yang tidak perlu.

 

📌 Cara kerja:

    Saat tombol diklik:

        Ambil isi dari inputText

        Masukkan ke dalam div sementara

        Hapus semua atribut style dan class dari semua elemen di dalamnya

        Ambil kembali isi HTML-nya

        Tampilkan ke outputText

        Copy ke clipboard

        Tampilkan alert sukses