Rumah > hujung hadapan web > tutorial js > 'Seni Pengaturcaraan DOM JavaScript' Nota Bacaan Asas DOM_javascript kemahiran

'Seni Pengaturcaraan DOM JavaScript' Nota Bacaan Asas DOM_javascript kemahiran

WBOY
Lepaskan: 2016-05-16 16:21:22
asal
1350 orang telah melayarinya

DOM
         
DOM: Model Objek Dokumen;

Nod

Nod unsur: Atom DOM ialah nod unsur. Elemen seperti ,

,

    . Elemen boleh mengandungi elemen lain. Satu-satunya elemen yang tidak terkandung dalam elemen lain ialah

    Nod teks: Dalam dokumen XHTML, nod teks sentiasa disertakan di dalam nod elemen.

    Nod atribut: Nod atribut digunakan untuk memberikan penerangan yang lebih khusus tentang elemen. Contohnya, hampir setiap elemen mempunyai atribut tajuk dan kita boleh menggunakan atribut ini untuk menerangkan dengan tepat perkara yang terkandung dalam elemen:

    Jangan lupa beli barang ini.

    Dalam DOM, title="a gentle reminder" ialah nod atribut.

    CSS

    Dapatkan elemen

    Terdapat tiga kaedah untuk mendapatkan nod elemen: getElementById, getElementsByTagName dan getElementsByClassName.
    GetElementsByTagName membenarkan kad bebas sebagai parameternya, yang bermaksud bahawa setiap elemen dalam dokumen akan mempunyai tempat dalam tatasusunan yang dikembalikan oleh fungsi ini. Aksara kad bebas ("*") mesti disertakan dalam tanda petikan untuk membezakannya daripada operasi pendaraban.

    Anda juga boleh menggabungkan getElementById dan getElementsByTagName. Seperti yang ditunjukkan di bawah:

        var shopping = document.getElementById("purchase");
        var item = shopping.getElementsByTagName("*");


    Dengan cara ini anda boleh mendapatkan bilangan elemen yang mengandungi nilai atribut id pembelian.

    Kaedah getElementsByClassName hanya disokong oleh penyemak imbas yang lebih baharu. Untuk mengimbangi ini, pengaturcara skrip DOM perlu menggunakan kaedah DOM sedia ada untuk melaksanakan getElementsByClassName mereka sendiri. Dalam kebanyakan kes, proses pelaksanaannya hampir serupa dengan getElementsByClassName berikut:

    Fungsi getElementsByClassName(nod, nama kelas){
    If(node.getElementsByClassName){
                 kembalikan node.getElementsByClassName(classname);
             }lain{
            hasil var = Array baharu();
                var elems = node.getElementsByTagName("*");
    untuk(var i=0;i If(elems[i].className.indexOf(classname) != -1){
    keputusan[results.length] = elem[i];
                }
             }
             kembalikan hasil;
    }
    }


    Fungsi getElementsByClassName ini menerima dua parameter Nod pertama mewakili titik permulaan elemen carian dalam pepohon DOM, dan nama kelas kedua ialah nama kelas yang akan dicari.

    Mendapatkan dan menetapkan sifat

    getAttribute ialah fungsi dengan hanya satu parameter - nama atribut yang anda ingin tanyakan:

    object.getAttribute(attribute)

    setAttribute() membenarkan kami mengubah suai nilai nod atribut. Selepas mengubah suai dokumen melalui setAttribute, apabila anda melihat kod sumber dokumen melalui pilihan sumber paparan penyemak imbas, anda masih akan melihat nilai atribut sebelum perubahan Dalam erti kata lain, pengubahsuaian yang dibuat oleh setAttribute tidak akan berubah dicerminkan dalam kod sumber dokumen itu sendiri. Fenomena "ketidakkonsistenan antara rupa dan dalam" ini datang daripada mod kerja DOM: kandungan statik dokumen dimuatkan dahulu, dan kemudian segar semula dinamik tidak menjejaskan kandungan statik dokumen. Inilah kuasa sebenar DOM: menyegarkan kandungan halaman tanpa memuat semula halaman dalam penyemak imbas.

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