Rumah >hujung hadapan web >tutorial js >Bagaimanakah Saya Boleh Memaparkan HTML dalam TextArea Tanpa Menggunakan Alat Luaran?

Bagaimanakah Saya Boleh Memaparkan HTML dalam TextArea Tanpa Menggunakan Alat Luaran?

DDD
DDDasal
2024-12-08 05:01:09874semak imbas

How Can I Display HTML in a TextArea Without Using External Tools?

Paparkan HTML dalam TextArea Tanpa Alat Luaran

Memberikan teg HTML dalam textarea memberikan cabaran kerana sifat teks sahaja yang wujud dalam textareas . Untuk mengatasi had ini, pertimbangkan untuk menggunakan div boleh diedit kandungan, yang membolehkan manipulasi kandungan HTML dengan berkesan.

Melaksanakan Div Boleh Diedit Kandungan

Melaksanakan div boleh diedit kandungan ialah terus terang:

<div contenteditable="true"></div>

Div ini memberi anda kawalan penuh ke atas kandungannya, termasuk kemasukan teg HTML untuk pemformatan dan struktur.

Contoh

Untuk menggambarkan kefungsian div boleh edit kandungan, rujuk ini contoh:

HTML

<div contenteditable="true">
    This is the first line.<br>
    See, how the text fits here, also if<br>
    there is a <strong>linebreak</strong> at the end?<br>
    It works nicely.<br>
    <br><span>

CSS

div.editable {
    width: 300px;
    height: 200px;
    border: 1px solid #ccc;
    padding: 5px;
}

strong {
    font-weight: bold;
}

Contoh ini menunjukkan cara kandungan boleh diubah suai secara dinamik, termasuk menambah tag HTML untuk penekanan (), perubahan warna dan pemisah baris.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memaparkan HTML dalam TextArea Tanpa Menggunakan Alat Luaran?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn