【公告】網站目前停止所有的課程訂閱服務,除了 7 月底預計完成上線的 KBF 餘下課程影片,將不會再新增其它課程內容,原有學員權益不受影響,造成不便還請見諒,我們正在開發以 Python 為主的課程主題,未來將會合併且擴充目前的課程內容,提供更好的課程訂閱服務,感謝學員的支持。

jQuery 與 JavaScript 比較 (4) - 存取元素屬性

存取元素的屬性只需透過 attr() 方法即可,例如底下有一張圖片:



以下為圖片的構成標籤:

<img border="0" src="…/kangting_large_1020.jpg" width="680" />

透過jQuery 取出標籤的width 屬性需要以下的語法:

var img_width = $('#skyview').attr('width');

img_width 儲存取得的圖片寬度,也就是 680 ,如果要重設width ,同樣透過 attr() 方法即可,語法如下:

  $('#skyview').attr('width', 260);

經過這一行語法的設定,圖片寬度被修改為 260 ,圖片寬度從 680 縮減為 260 ,結果如下:



同樣的功能,JavaScript需要getAttribute()設定屬性,例如以下的語法:

var img_width = document.getElementById('skyview').getAttribute('width');

以上這一行取出圖片的寬度,而重設寬度屬性則需引用另外一個設定方法setAttribute() :

document.getElementById('skyview').setAttribute('width', 260);

其它的屬性透過相同的語法均能進行存取設定,而針對與樣式有關的 class ,則有專屬性的方法,下一篇作說明。

沒有留言: