Rumah > Artikel > hujung hadapan web > Bolehkah jquery menambah atribut pada imej?
jquery boleh menambah atribut pada imej. Dua kaedah penambahan: 1. Gunakan attr() untuk menambah atribut pada elemen img, sintaksnya ialah "$("img").attr("Nama Atribut", "Nilai""; 2. Gunakan prop() untuk menambah atribut kepada elemen gambar , sintaksnya ialah "$("img").prop("property name","value")".
Persekitaran pengendalian tutorial ini: sistem Windows 7, versi jquery 1.10.2, komputer Dell G3.
Terdapat dua kaedah dalam jquery untuk menetapkan atribut
attr()
prop()
1. Gunakan kaedah attr()
attr() untuk menetapkan atau mengembalikan atribut dan nilai elemen yang dipilih.
Apabila kaedah ini digunakan untuk menetapkan nilai atribut, satu atau lebih pasangan atribut/nilai ditetapkan untuk elemen padanan.
$("img").attr("属性名","属性值");
Contoh:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("button").click(function() { $("img").attr("align","right"); }); }); </script> </head> <body> <img src="img/1.jpg" style="max-width:90%" alt="Bolehkah jquery menambah atribut pada imej?" ><br> <br><br> <button>给图片添加align属性,设置右对齐</button> </body> </html>
2. Gunakan prop()
prop() Kaedahnya adalah sama seperti attr(), dan juga menetapkan atau mengembalikan atribut dan nilai elemen yang dipilih.
Apabila kaedah ini digunakan untuk menetapkan nilai atribut, satu atau lebih pasangan atribut/nilai ditetapkan untuk set elemen padanan.
Sintaks:
$("img").prop("属性名","属性值");
Contoh:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("button").click(function() { $("img").prop("alt","图像的替代文本"); }); }); </script> </head> <body> <img src="img/1.jpg" style="max-width:90%" alt="Bolehkah jquery menambah atribut pada imej?" ><br> <br><br> <button>给图片添加alt属性</button> </body> </html>
Pengetahuan lanjutan: elemen imej img
mentakrifkan imej dalam halaman HTML. Teg mempunyai dua atribut yang diperlukan: src dan alt. Atribut teg:Atribut | Nilai | Penerangan | ||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
sejajarkan | atas bawah tengah kiri kanan |
HTML5 tidak disokong. HTML 4.01 ditamatkan.
Menentukan cara imej disusun berbanding dengan teks sekeliling.
|||||||||||||||||||||||||||||||||||||||||||
memuatkan | bersemangat: memuatkan segera malas: melengahkan pemuatan | Menentukan sama ada penyemak imbas harus memuatkan imej dengan segera atau malas. | ||||||||||||||||||||||||||||||||||||||||||
alt | text | Menentukan teks alternatif untuk imej. | ||||||||||||||||||||||||||||||||||||||||||
sempadan | piksel | HTML5 tidak disokong. HTML 4.01 ditamatkan.
|
||||||||||||||||||||||||||||||||||||||||||
asal silang | tanpa nama use-credentials |
Tetapkan atribut merentas domain imej | ||||||||||||||||||||||||||||||||||||||||||
ketinggian | piksel | Menentukan ketinggian imej. | ||||||||||||||||||||||||||||||||||||||||||
hspace | piksel | HTML5 tidak disokong. HTML 4.01 ditamatkan. Menentukan jidar di sebelah kiri dan kanan imej. |
||||||||||||||||||||||||||||||||||||||||||
ismap | ismap | Menentukan imej sebagai peta imej sebelah pelayan. | ||||||||||||||||||||||||||||||||||||||||||
longdesc | URL | HTML5 tidak disokong. HTML 4.01 ditamatkan. Menuding ke URL yang mengandungi dokumen perihalan imej yang panjang. | ||||||||||||||||||||||||||||||||||||||||||
src | URL | Menentukan URL untuk memaparkan imej. | ||||||||||||||||||||||||||||||||||||||||||
usemap | #mapname | Mentakrifkan imej sebagai peta imej sebelah klien. | ||||||||||||||||||||||||||||||||||||||||||
vspace | piksel | HTML5 tidak disokong. HTML 4.01 ditamatkan. Menentukan margin di bahagian atas dan bawah imej. | ||||||||||||||||||||||||||||||||||||||||||
lebar | piksel | Menentukan lebar imej. |
Atas ialah kandungan terperinci Bolehkah jquery menambah atribut pada imej?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!