Bagaimana untuk Mengemas kini Kandungan Teks tanpa Menjejaskan Elemen Kanak-kanak dalam JavaScript dan jQuery?

Manipulasi Teks: Memelihara Elemen Kanak-kanak

Soalan:

Bagaimanakah saya boleh mengemas kini teks elemen secara dinamik tanpa menjejaskan anaknya unsur? Pertimbangkan HTML berikut:

<div>
   **text to change**
   <someChild>
       text that should not change
   </someChild>
   <someChild>
       text that should not change
   </someChild>
</div>

Sebagai pemula dalam jQuery, cari fungsi atau pemilih yang sesuai untuk menyelesaikan tugas ini tanpa memperkenalkan bekas teks tambahan.

Jawapan:

Walaupun jQuery menawarkan kaedah lanjutan untuk manipulasi sedemikian, penyelesaian juga boleh dilakukan menggunakan JavaScript vanila. Sifat childNodes menyediakan akses kepada semua nod dalam elemen, termasuk nod teks.

Sebagai contoh, jika teks yang akan ditukar sentiasa merupakan elemen pertama div, kod ini boleh digunakan:

var divElement = document.getElementById('your_div');
var textNode = divElement.childNodes[0];

textNode.nodeValue = 'new text';

Sebagai alternatif, jQuery boleh digunakan untuk menyasarkan div dan mendapatkan rujukan kepada nod teks:

var divElement = $('your_div').get(0);
var textNode = divElement.childNodes[0];

textNode.nodeValue = 'new text';

Ini kaedah mengemas kini kandungan teks secara berkesan sambil mengekalkan struktur asal dan kandungan elemen kanak-kanak.

Atas ialah kandungan terperinci Bagaimana untuk Mengemas kini Kandungan Teks tanpa Menjejaskan Elemen Kanak-kanak dalam JavaScript dan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!