JavaScript Image對象實現(xiàn)原理實例解析
更新時間：2020年08月26日 10:22:36 作者：天馬3798
這篇文章主要介紹了JavaScript Image對象實現(xiàn)原理實例解析,文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
一、JavaScript Image對象 整理
Image 對象
Image 對象代表嵌入的圖像。
<img> 標簽每出現(xiàn)一次，一個 Image 對象就會被創(chuàng)建。
Image 對象屬性
W3C: W3C 標準。
| 屬性 | 描述 | W3C |
|---|---|---|
| align | 設(shè)置或返回與內(nèi)聯(lián)內(nèi)容的對齊方式。 | Yes |
| alt | 設(shè)置或返回無法顯示圖像時的替代文本。 | Yes |
| border | 設(shè)置或返回圖像周圍的邊框。 | Yes |
| complete | 返回瀏覽器是否已完成對圖像的加載。 | No |
| height | 設(shè)置或返回圖像的高度。 | Yes |
| hspace | 設(shè)置或返回圖像左側(cè)和右側(cè)的空白。 | Yes |
| longDesc | 設(shè)置或返回指向包含圖像描述的文檔的 URL。 | Yes |
| lowsrc | 設(shè)置或返回指向圖像的低分辨率版本的 URL。 | No |
| name | 設(shè)置或返回圖像的名稱。 | Yes |
| src | 設(shè)置或返回圖像的 URL。 | Yes |
| useMap | 設(shè)置或返回客戶端圖像映射的 usemap 屬性的值。 | Yes |
| vspace | 設(shè)置或返回圖像的頂部和底部的空白。 | Yes |
| width | 設(shè)置或返回圖像的寬度。 | Yes |
Image 對象事件
| 事件 | 描述 | W3C |
|---|---|---|
| onabort | 當用戶放棄圖像的裝載時調(diào)用的事件句柄。 | Yes |
| onerror | 在裝載圖像的過程中發(fā)生錯誤時調(diào)用的事件句柄。 | Yes |
| onload | 當圖像裝載完畢時調(diào)用的事件句柄。 |
二、常用使用方法
var img = new Image();
img.onload = function () {
console.info('加載成功');
}
//先綁定事件，然后指定地址
img.src = '../img/images/2.jpg';
document.body.appendChild(img);
console.info(img);
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要為大家詳細介紹了原生js生成圖片驗證碼，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-10-10
JavaScript是用來在數(shù)據(jù)被傳輸?shù)椒?wù)前對html表單中輸入的數(shù)據(jù)進行驗證，使用javascript對用戶輸入的信息進行驗證是項目必須的，下面小編給大家整理一些比較常用的javascript表單驗證，需要的朋友可以參考下2015-08-08
Three.js+React使二維圖片呈現(xiàn)3D效果
這篇文章主要為大家介紹了如何利用Three.js+React技術(shù)棧，將二維漫畫圖片轉(zhuǎn)化為三維視覺效果。文中的實現(xiàn)方法講解詳細，需要的可以參考一下2022-02-02
這篇文章主要為大家詳細介紹了js實現(xiàn)點擊上傳圖片并設(shè)為模糊背景，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08
webpack開發(fā)環(huán)境和生產(chǎn)環(huán)境的深入理解
這篇文章主要介紹了webpack開發(fā)環(huán)境和生產(chǎn)環(huán)境的深入理解，詳細的介紹了什么是開發(fā)環(huán)境和生產(chǎn)環(huán)境并配置，非常具有實用價值，需要的朋友可以參考下2018-11-11
這篇文章主要為大家詳細介紹了原生JS實現(xiàn)點擊數(shù)字小游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-04-04
下面小編就為大家?guī)硪黄猨s操作DOM--添加、刪除節(jié)點的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
這篇文章主要介紹了基于javascript實現(xiàn)文字無縫滾動效果的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-03-03
本文收集了100個原生態(tài)JavaScript編寫的常用、實用自定義函數(shù),需要的朋友可以參考下2014-03-03
這篇文章主要為大家詳細介紹了javascript表單事件處理方法，感興趣的小伙伴們可以參考一下2016-05-05