Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk membuat nod dalam jquery

Bagaimana untuk membuat nod dalam jquery

王林
王林asal
2023-05-12 09:07:372132semak imbas

jQuery ialah perpustakaan JavaScript yang ringkas dan cekap yang memudahkan untuk mengendalikan dokumen HTML. Dalam pembangunan sebenar, kita sering perlu mencipta nod baharu dan menambahkannya pada dokumen.

Artikel ini akan memperkenalkan cara menggunakan jQuery untuk mencipta nod baharu dan menambahkannya pada dokumen.

1. Cipta nod baharu

jQuery menyediakan kaedah createElement() untuk mencipta nod baharu. Kaedah ini menerima satu parameter, yang mewakili nama teg bagi elemen yang akan dibuat.

Sebagai contoh, untuk mencipta elemen div baharu, anda boleh menggunakan kod berikut:

var newDiv = $("<div>");

Dalam kod di atas, kami menggunakan kaedah $() untuk mencipta objek jQuery baharu dan menambah ia untuk Berikan nilai kepada pembolehubah newDiv. Oleh kerana kami tidak menghantar sebarang parameter dalam kaedah $(), elemen div kosong dicipta.

2. Tetapkan atribut nod

Selepas mencipta nod baharu, kami boleh menetapkan atribut nod, seperti id, kelas, gaya, dll. jQuery menyediakan beberapa kaedah untuk menetapkan sifat ini, seperti attr(), addClass(), css(), dsb.

Sebagai contoh, untuk menambah atribut id pada elemen div yang baru dibuat, anda boleh menggunakan kod berikut:

var newDiv = $("<div>").attr("id", "myDiv");

Dalam kod di atas, kami menggunakan kaedah attr() untuk menetapkan atribut id objek newDiv untuk "myDiv".

3. Tambahkan nod anak

Selepas mencipta nod baharu dan menetapkan sifatnya, kami mungkin perlu menambahkannya pada dokumen. Berikut ialah dua situasi untuk memperkenalkan cara menambah.

  1. Lampirkan pada penghujung nod induk

Jika kita ingin menambah nod pada penghujung nod induk sedia ada, kita boleh menggunakan kaedah append() daripada nod induk.

Sebagai contoh, untuk menambah elemen Div baharu yang dibuat dalam kod di atas ke penghujung elemen badan, anda boleh menggunakan kod berikut:

$("body").append(newDiv);

Dalam kod di atas, kami menggunakan tambahan () kaedah untuk menambah elemen newDiv Ditambah pada penghujung elemen badan.

  1. Tambah pada kedudukan yang ditentukan

Jika kita perlu menambah nod pada kedudukan yang ditentukan bagi nod induk sedia ada, kita boleh menggunakan insertBefore() nod induk atau insertAfter( )kaedah.

Sebagai contoh, untuk menambah elemen Div baru yang dibuat dalam kod di atas sebelum nod anak pertama elemen badan, anda boleh menggunakan kod berikut:

$("body").children().first().before(newDiv);

Dalam kod di atas, kita mula-mula gunakan kaedah children() untuk mendapatkan semua nod anak elemen badan, kemudian gunakan kaedah first() untuk mendapatkan nod anak pertama, dan gunakan kaedah before() untuk menambah elemen newDiv sebelum nod anak pertama.

4. Ringkasan

Melalui pengenalan artikel ini, kami mempelajari cara menggunakan jQuery untuk mencipta nod baharu dan menambahkannya pada dokumen. Kita boleh mencipta nod baharu melalui kaedah createElement(), menetapkan atribut nod melalui attr(), addClass(), css() dan kaedah lain, dan menambah nod melalui append(), insertBefore(), insertAfter() dan kaedah lain ke dalam dokumen. Menguasai kaedah ini boleh membantu kami mengendalikan dokumen HTML dengan cepat dan cekap.

Atas ialah kandungan terperinci Bagaimana untuk membuat nod dalam jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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
Artikel sebelumnya:jquery menukar teks labelArtikel seterusnya:jquery menukar teks label