Pengenalan terperinci kepada perbezaan antara sifat dan atribut dalam pengetahuan JavaScript_Basic

1. Definisi

Harta: Semua elemen HTML diwakili oleh jenis HTMLElement Jenis HTMLElement mewarisi secara langsung daripada Element dan menambahkan beberapa atribut ini sepadan dengan lima ciri standard setiap elemen HTML: id, title, lang. dir, className. Nod DOM ialah objek, jadi ia boleh menambah sifat dan kaedah tersuai seperti objek JavaScript lain. Nilai harta boleh menjadi sebarang jenis data dan peka huruf besar dan kecil Sifat tersuai tidak akan muncul dalam kod html, tetapi hanya wujud dalam js.

Atribut: Atribut, berbeza daripada harta, atribut hanya boleh menjadi rentetan, tidak peka huruf besar-kecil, muncul dalam innerHTML, semua atribut boleh disenaraikan melalui atribut tatasusunan kelas.

2. Persamaan

Sifat dan atribut DOM standard disegerakkan. Sifat yang diiktiraf (bukan tersuai) ditambahkan pada objek DOM dalam bentuk atribut. Contohnya, id, align, style, dsb. Pada masa ini, anda boleh mengendalikan sifat atau menggunakan kaedah DOM ciri pengendalian seperti getAttribute() untuk mengendalikan atribut. Walau bagaimanapun, nama atribut yang dihantar ke getAttribute() adalah sama dengan nama atribut sebenar. Oleh itu, "kelas" mesti diluluskan apabila mendapatkan nilai atribut kelas.

3. Perbezaan

1). Untuk beberapa operasi ciri standard, terdapat perbezaan dalam nilai yang diperolehi oleh getAttribute dan titik (.). Seperti href, src, nilai, gaya, onclick dan pengendali acara lain.
2).href: getAttribute mendapat nilai sebenar href, manakala titik mendapat url lengkap, jadi terdapat perbezaan pelayar.

Salin kod Kod adalah seperti berikut:

      var a = document.body.children[0]
a.href = '/'
makluman( 'atribut:' a.getAttribute('href') ) // '/'
alert( 'property:' a.href ) // IE: '/', lain-lain: URL penuh

Mendapatkan nilai src adalah serupa dengan href, tetapi IE juga akan mengembalikan URL penuh
Nilai ini juga mempunyai beberapa sifat terbina dalam untuk penyegerakan 'sehala'.
Sebagai contoh, input.value disegerakkan daripada atribut (iaitu sifat disegerakkan daripada atribut)

Salin kod Kod adalah seperti berikut:

      var input = document.body.children[0];
​​​​ input.setAttribute('value', 'new');
makluman( input.value ); // 'baru', input.value ditukar
alert( input.getAtrribute(value) ); // 'baru'

Tetapi atribut tidak boleh disegerakkan daripada harta:

Salin kod Kod adalah seperti berikut:

        var input = document.body.children[0];
input.value = 'baharu';
alert(input.getAttribute('value')); // 'markup', tidak diubah!

getAttribute mendapat nilai awal, manakala titik mendapat nilai awal atau nilai .value yang diubah suai Contohnya, apabila pelawat memasukkan aksara tertentu, atribut 'nilai' mengekalkan nilai asal selepas sifat itu dikemas kini. Nilai asal boleh digunakan untuk menyemak sama ada input telah berubah, atau untuk menetapkannya semula.

Untuk pengendali acara seperti gaya dan onclick, kaedah getAttribute akan mengembalikan rentetan apabila diakses dan titik mengembalikan objek dan fungsi pengendalian acara yang sepadan.

Untuk atribut yang ditandai dalam input

Salin kod Kod adalah seperti berikut:

input var = document.body.children[0]
alert( input.checked ) // benar
alert( input.getAttribute('checked') ) // rentetan kosong

getAttribute mendapat nilai yang sebenarnya anda tetapkan. Titik itu mengembalikan nilai Boolean.

Perbezaan dalam keserasian penyemak imbas

1. Dalam pelayar IE 2. IE

Salin kod Kod adalah seperti berikut:

document.body.abba = 1 // tetapkan harta (kini boleh membacanya dengan getAttribute)
document.body.ABBA = 5 // tetapkan harta dengan kes lain
// mesti mendapatkan harta yang bernama 'ABba' dalam cara yang tidak sensitif huruf.
alert( document.body.getAttribute('ABba') ) // 1

Utamakan harta

Dalam aplikasi sebenar, 98% daripada operasi DOM menggunakan sifat.
Terdapat hanya dua situasi di mana anda perlu menggunakan atribut

1. Sesuaikan atribut HTML kerana ia tidak disegerakkan dengan sifat DOM.
2. Akses atribut HTML terbina dalam, yang tidak boleh disegerakkan daripada sifat. Contohnya, nilai teg INPUT.