Bagaimanakah Saya Boleh Mengemas kini Teks Dalam Elemen Tanpa Menjejaskan Elemen Anaknya?

Menukar Teks Elemen tanpa Mengubah Elemen Kanak-kanak

Soalan:

Mengemas kini teks elemen secara dinamik sering ditemui oleh web pembangun, terutamanya apabila berurusan dengan struktur DOM yang kompleks. Pertimbangkan coretan HTML berikut:

<div>

Tugasnya ialah untuk mengubah suai teks tebal tanpa menjejaskan perenggan kanak-kanak. Ini mencabar, terutamanya untuk pemula jQuery.

Penyelesaian jQuery:

Mark menyediakan penyelesaian optimum menggunakan jQuery, yang menawarkan fungsi yang ringkas dan cekap:

$("div#my-div").contents().filter(function() {
    return this.nodeType == 3; // Node type 3 represents text nodes
}).text("New Text");

Penyelesaian JavaScript (Pilihan):

Dalam JavaScript tulen, sifat childNodes boleh digunakan untuk mengakses semua nod anak sesuatu elemen, termasuk nod teks. Jika teks sasaran sentiasa anak pertama, pendekatan berikut boleh digunakan:

var myDiv = document.getElementById("my-div");
var textNode = myDiv.childNodes[0]; // Assume the text is the first child
textNode.nodeValue = "New Text";

Kesimpulan:

Kedua-dua jQuery dan JavaScript boleh digunakan untuk mengemas kini secara dinamik teks unsur sambil mengekalkan unsur anaknya. Penyelesaian jQuery menyediakan pendekatan ringkas dan tujuan umum, manakala kaedah JavaScript menawarkan penyelesaian yang lebih khusus yang menganggap teks adalah anak pertama.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengemas kini Teks Dalam Elemen Tanpa Menjejaskan Elemen Anaknya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!