Bagaimana Menggunakan HTML & Dengan Shadow DOM
Slot HTML adalah salah satu piawaian yang paling luar biasa yang dibuat oleh W3C. Gabungkan itu dengan standard W3C lain yang dipanggil templat, dan anda mempunyai ramuan hebat untuk bekerja dengan. Mampu untuk membuat dan menambah elemen HTML ke halaman menggunakan JavaScript adalah tugas yang penting dan penting.
Ia berguna apabila coretan kod terpaksa muncul hanya pada masa-masa tertentu, atau apabila anda tidak mahu menaip ratusan unsur HTML berstruktur yang sama tetapi mahu automasi proses itu.
Mencipta elemen HTML dalam JavaScript adalah tidak begitu wajar. Ia adalah masalah yang perlu diperiksa dan semak semula jika anda telah menutup semua tag, meletakkannya dalam urutan yang betul, semua dalam semua, hanya ada juga banyak untuk menaip dan menjejaki. Walau bagaimanapun, kemelut ini, mendapat penyelesaian apabila tag muncul. Sekiranya ada sesuatu yang perlu ditambah ke halaman secara dinamik, anda boleh memasukkannya ke dalam elemen.
Dalam catatan ini, saya akan menunjukkan kepada anda bagaimana anda boleh menggunakannya tag bersama dengan JavaScript buat kilang meja mini HTML yang boleh mencipta dan menampung beratus-ratus jadual yang sama.
The
The tag memegang kod HTML itu tidak akan diberikan oleh penyemak imbas sehingga ia ditambah dengan betul pada dokumen itu, menggunakan JavaScript. The elemen.
A DOM Shadow adalah serupa dengan DOM biasa (model dokumen dipecahkan daripada HTML). Ia mencipta pokok sampingan (pokok Shadow DOM), yang mempunyai a akarnya sendiri dan juga boleh mempunyai gaya sendiri.
Apabila anda memasukkan pokok Shadow DOM menjadi elemen dalam dokumen utama - elemen kemudiannya akan dipanggil hos bayangan -, semua elemen kanak-kanak hantu bayangan yang ditandai dengan slot atribut (tidak sama dengan yang disebutkan di atas
The Shadow DOM, sebagai penulisan artikel ini (Julai 2017), adalah disokong hanya dalam pelayar berasaskan WebKit- dan Blink tetapi anda boleh menyemak status penyokong sebenar pada CanIUse pada bila-bila masa.
Menyediakan HTML
Masih membingungkan? Mari lihat beberapa kod, bermula dengan elemen.
Dalam Di dalam templat, Saya juga telah menambah beberapa gaya asas untuk jadual, menggunakan , ada kami akan gunakan sebagai pelan tindakan untuk mewujudkan beberapa jadual yang akan ditambah kepada dokumen. Disana ada
dan ) bertindak sebagai pemegang tempat untuk tajuk lajur dan nilai sel. Setiap slot mempunyai unik nama atribut itu mengenal pasti.