Rumah > hujung hadapan web > tutorial js > Kaedah JQuery untuk menggantikan DOM nodes_jquery

Kaedah JQuery untuk menggantikan DOM nodes_jquery

WBOY
Lepaskan: 2016-05-16 15:55:53
asal
1168 orang telah melayarinya

Contoh dalam artikel ini menerangkan cara menggantikan nod DOM dengan JQuery. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Jika anda ingin menggantikan nod, jQuery menyediakan kaedah yang sepadan, iaitu replaceWith() dan replaceAll().

Fungsi kaedah

replaceWith() adalah untuk menggantikan semua elemen padanan dengan elemen HTML atau DOM yang ditentukan.

Kod JQuery untuk contoh ini:

<script type="text/javascript">
//<![CDATA[
$(function(){
 $("#btn_1").click(function(){
  $(".nm_p").replaceWith('<p class="nm_p">欢迎访问www.jb51.net</p>'); 
 })
 $("#btn_2").click(function(){
  $(".nm_p").replaceWith('<p class="nm_p" title="欢迎访问脚本之家" >欢迎访问脚本之家</p>'); 
  // 同样的实现: $('<p class="nm_p">欢迎访问www.jb51.net</p>').replaceAll(".nm_p"); 
 })
});
//]]>
</script>
Salin selepas log masuk

Anda juga boleh menggunakan kaedah lain dalam JQuery, replaceAll(), yang mempunyai kesan yang sama seperti kaedah replaceWith(), kecuali operasi replaceWith() diterbalikkan Anda boleh menggunakan kod jQuery berikut untuk mencapai fungsi yang sama :

Salin kod Kod adalah seperti berikut:
$('

Selamat datang ke www.jb51 .net

').replaceAll(".nm_p");

Kedua-dua ayat kod JQuery ini akan mencapai kesan penggantian nod.

PS: Jika acara telah terikat pada elemen sebelum penggantian, acara asal terikat akan hilang bersama-sama dengan elemen diganti selepas penggantian, dan acara itu perlu diikat semula pada elemen baharu.

Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
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
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan