Bagaimanakah Saya Boleh Mencipta Elemen DOM dengan jQuery, Sama Seperti Menggunakan `document.createElement`?-tutorial js-php.cn

Bagaimanakah Saya Boleh Mencipta Elemen DOM dengan jQuery, Sama Seperti Menggunakan `document.createElement`?

Linda Hamilton

Lepaskan： 2024-11-23 06:01:23

asal

834 orang telah melayarinya

How Can I Create DOM Elements with jQuery, Just Like Using `document.createElement`?

Mencipta Elemen DOM dengan jQuery: Setara dengan document.createElement

Dalam pembangunan web moden, jQuery menyediakan pendekatan ringkas dan serba boleh untuk manipulasi DOM . Apabila beralih daripada kod JavaScript lama yang menggunakan document.createElement, adalah penting untuk meneroka alternatif jQuery.

Pertimbangkan contoh berikut daripada kod warisan:

var d = document;
var odv = d.createElement("div");
odv.style.display = "none";
this.OuterDiv = odv;

var t = d.createElement("table");
t.cellSpacing = 0;
t.className = "text";
odv.appendChild(t);

Salin selepas log masuk

Dalam jQuery, kod yang setara untuk membuat div dan menambahkan ialah:

this.$OuterDiv = $('<div></div>')
    .hide()
    .append($('<table></table>')
        .attr({ cellSpacing : 0 })
        .addClass("text")
    )
;

Salin selepas log masuk

Untuk menjelaskan, $('

') mencipta elemen baharu dengan teg div dan segera menutup teg. Pendekatan ini memerlukan teg penutup tambahan untuk struktur DOM yang betul. Sebagai alternatif, anda boleh mencipta elemen tanpa menutupnya secara eksplisit menggunakan $('

'), tetapi disyorkan untuk menggunakan pendekatan teg tertutup untuk memastikan hasil yang konsisten merentas penyemak imbas yang berbeza.

Perhatikan bahawa sintaks jQuery menyediakan antara muka berantai, membolehkan anda melakukan berbilang operasi (seperti penggayaan dan penambahan) pada elemen yang baru dicipta secara ringkas cara.

Selain itu, jika prestasi membimbangkan, perlu dinyatakan bahawa document.createElement kekal sebagai kaedah terpantas untuk mencipta elemen DOM, seperti yang ditunjukkan dalam ujian penanda aras. Perbezaan prestasi, bagaimanapun, adalah minimum untuk kebanyakan aplikasi praktikal.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta Elemen DOM dengan jQuery, Sama Seperti Menggunakan `document.createElement`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!