Gunakan JavaScript untuk membalut nod elemen teks dengan kemahiran DIV_javascript

Apabila aplikasi anda bergantung pada perpustakaan JavaScript tertentu, anda secara tidak sengaja cuba menyelesaikan masalah dengan perpustakaan tertentu sendiri, dan bukannya masalah dengan bahasa. Seperti ketika saya cuba membungkus teks (yang mungkin juga mengandungi elemen HTML) dengan elemen DIV. Katakan anda mempunyai HTML berikut:

This is some text and <a href="">a link</a>

Pada masa ini, jika anda ingin menukarnya kepada yang berikut:

<div>This is some text and <a href="">a link</a><div>

Kaedah brute force yang paling mudah ialah anda boleh melakukan kemas kini melalui sifat .innerHTML pada elemen induk, tetapi masalahnya ialah semua pendengar acara terikat akan menjadi tidak sah kerana menggunakan innerHTML akan mencipta semula elemen HTML. Betapa besarnya gelas! Jadi pada masa ini, kita hanya boleh menggunakan JavaScript untuk mencapainya - pembaris pendek dan inci panjang. Berikut ialah kod pelaksanaan:

var newWrapper = document.createElement('div'); 
while(existingParent.firstChild) { 
// 移动DOM元素,不会创建新元素 
newWrapper.appendChild(existingParent.firstChild); 
}

For loop tidak boleh digunakan di sini, kerana childNodes ialah koleksi nod dinamik dan mengalihkan nod akan menjejaskan nilai indeksnya. Kami menggunakan gelung sementara untuk terus menyemak Anak pertama bagi elemen induk Jika ia mengembalikan nilai yang mewakili palsu, maka anda tahu bahawa semua nod telah dialihkan ke induk baharu!