如何理解DOM拷贝clone()
克隆节点是DOM的常见操作,jQuery提供一个clone方法,专门用于处理dom的克隆:
.clone()方法深度 复制所有匹配的元素集合,包括所有匹配元素、匹配元素的下级元素、文字节点。
clone方法比较简单就是克隆节点,但是需要注意,如果节点有事件或者数据之类的其他处理,我们需要通过clone(ture)传递一个布尔值ture用来指定,这样不仅仅只是克隆单纯的节点结构,还要把附带的事件与数据给一并克隆了
例如:
HTML部分<p></p>JavaScript部分 $("p").on('click', function() {//执行操作}) //clone处理一 $("p").clone() //只克隆了结构,事件丢失 //clone处理二 $("p").clone(true) //结构、事件与数据都克隆
使用上就是这样简单,使用克隆的我们需要额外知道的细节:
clone()方法时,在将它插入到文档之前,我们可以修改克隆后的元素或者元素内容,如右边代码我 $(this).clone().css('color','red') 增加了一个颜色
通过传递true,将所有绑定在原始元素上的事件处理函数复制到克隆元素上
clone()方法是jQuery扩展的,只能处理通过jQuery绑定的事件与数据
元素数据(data)内对象和数组不会被复制,将继续被克隆元素和原始元素共享。深复制的所有数据,需要手动复制每一个
案例分析:
<!DOCTYPE html><html><head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <style> .left, .right { width: 300px; height: 120px; } .left p, .right p { width: 100px; height: 90px; padding: 5px; margin: 5px; float: left; border: 1px solid #ccc; background: #bbffaa; } </style></head><body> <h2>通过clone克隆元素</h2> <p class="left"> <p class="aaron1">点击,clone浅拷贝</p> <p class="aaron2">点击,clone深拷贝,可以继续触发创建</p> </p> <script type="text/javascript"> //只克隆节点 //不克隆事件 $(".aaron1").on('click', function() { $(".left").append( $(this).clone().css('color','red') ) }) </script> <script type="text/javascript"> //克隆节点 //克隆事件 $(".aaron2").on('click', function() { console.log(1) $(".left").append( $(this).clone(true).css('color','blue') ) }) </script></body></html>
Atas ialah kandungan terperinci 如何理解DOM拷贝clone() . Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Halo semua, hari ini mari kita bercakap tentang teknologi salinan sifar Linux. Kami akan menggunakan panggilan sistem fail hantar sebagai titik masuk untuk meneroka secara mendalam prinsip asas teknologi salinan sifar. Idea teras teknologi salinan sifar adalah untuk meminimumkan penyalinan data antara kenangan dan meningkatkan kecekapan dan prestasi penghantaran data dengan mengoptimumkan laluan penghantaran data. 1. Pengenalan kepada teknologi sifar-salinan Teknologi sifar-salinan Linux ialah teknologi yang digunakan untuk mengoptimumkan penghantaran data Ia meningkatkan kecekapan penghantaran data dengan mengurangkan bilangan salinan data antara mod kernel dan mod pengguna. Semasa proses penghantaran data, biasanya perlu untuk menyalin data dari penimbal kernel ke penimbal aplikasi, dan kemudian dari penimbal aplikasi ke penimbal peranti rangkaian sebelum penghantaran boleh diselesaikan. Kelebihan teknologi sifar salinan

Artikel ini membincangkan teknologi salinan sifar utama dalam Linux dan senario yang berkenaan untuk teknologi salinan sifar. Untuk mewujudkan konsep salinan sifar dengan cepat, kami memperkenalkan senario biasa.

Pemahaman mendalam tentang penggunaan paip Linux Dalam sistem pengendalian Linux, paip adalah fungsi yang sangat berguna yang boleh menggunakan output satu arahan sebagai input bagi arahan lain, dengan itu mudah merealisasikan pelbagai pemprosesan dan operasi data yang kompleks. Pemahaman mendalam tentang cara paip Linux digunakan adalah sangat penting untuk pentadbir dan pembangun sistem. Artikel ini akan memperkenalkan konsep asas saluran paip dan menunjukkan cara menggunakan saluran paip Linux untuk pemprosesan dan operasi data melalui contoh kod tertentu. 1. Konsep asas paip dalam Linux

Kaedah untuk bertindak balas untuk melaksanakan fungsi salin: 1. Melaksanakan fungsi salin melalui perpustakaan "copy-to-clipboard" 2. Gunakan perpustakaan "react-copy-to-clipboard" untuk melaksanakan fungsi salin; kaedah navigator.clipboard.writeText(e )" untuk merealisasikan penyalinan; 4. Gunakan kaedah "document.execcommand("copy")" untuk merealisasikan penyalinan; 5. Gunakan perpustakaan "copy-js" untuk merealisasikan fungsi salinan.

Cara memahami kaedah lulus nilai dengan betul dalam PHP PHP ialah bahasa skrip yang digunakan secara meluas dalam pembangunan Web, dan kaedah lulus parameter dalam PHP terutamanya termasuk lulus nilai dan lulus rujukan. Dan memahami bagaimana nilai dihantar dalam PHP adalah penting untuk menulis kod yang cekap. Artikel ini akan membincangkan kaedah lulus nilai dalam PHP secara terperinci dan menggunakan contoh kod khusus untuk membantu pembaca memahami dengan lebih baik. Konsep asas kaedah lulus nilai adalah untuk menyalin nilai pembolehubah dan menghantarnya kepada fungsi atau kaedah Operasi pada nilai dalam fungsi tidak akan menjejaskannya.

Komen adalah bahagian yang sangat penting dalam pengaturcaraan Go. Komen boleh membantu pengaturcara lebih memahami logik, tujuan dan butiran kod, dengan itu meningkatkan kebolehbacaan dan kebolehselenggaraan kod. Artikel ini akan memperkenalkan kepentingan ulasan dalam bahasa Go dan menggabungkannya dengan contoh kod khusus untuk menggambarkan cara ulasan membantu pemahaman kod. Mula-mula, mari lihat contoh program Go yang mudah: packagemainimport "fmt" funcmain(){/

Untuk memahami rentetan secara mendalam. Fungsi split dalam dokumentasi bahasa Go, contoh kod khusus diperlukan Dalam bahasa Go, operasi rentetan adalah keperluan yang sangat biasa. Antaranya, pakej rentetan ialah pakej standard yang disediakan oleh bahasa Go dan menyediakan pelbagai fungsi pemprosesan rentetan. Antaranya, strings.Split function adalah salah satu fungsi yang biasa digunakan. Sebelum kita menyelam secara rasmi ke dalam rentetan. Fungsi Split,

Memandangkan kerumitan aplikasi web moden terus meningkat, logik kod menjadi semakin kompleks. Untuk menyelesaikan masalah ini, perisian tengah menjadi semakin popular dalam pembangunan web moden. ThinkPHP6 ialah rangka kerja PHP popular yang turut menyokong perisian tengah. Dalam artikel ini, kita akan membincangkan asas dan kegunaan praktikal perisian pertengahan ThinkPHP6. Apakah middleware? Dalam pembangunan web, middleware merujuk kepada cara memproses permintaan dan respons HTTP. Apabila pelanggan menghantar permintaan kepada pelayan,
