JavaScript中onload事件的使用方法

發布時間：2020-09-26 10:15:04 來源：億速云閱讀：360 作者：小新欄目：web開發

小編給大家分享一下JavaScript中onload事件的使用方法，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

我們先來看一下onload事件的基本寫法

obj.onload = function() {
// 加載完成后需要立即處理的事件
}

對于obj，可以指定為window，HTML的body，img等元素。

下面我們來看具體的示例

加載頁面時執行

如果執行以下代碼，可以在讀取window對象時處理

window.onload = function() {
  alert("頁面已加載！");
};

運行效果如下

JavaScript中onload事件的使用方法

以下代碼實現的效果也一樣

function load() {
  alert("頁面已加載！");
}
window.onload = load;

加載圖像時執行

代碼如下

var img = new Image();
img.onload = function() {
  alert("圖像已加載！");
};
img.src = 'img/mouse.png';

運行效果如下

JavaScript中onload事件的使用方法

最后我們來看一下onload事件使用的注意事項

具有onload的事件的處理程序無法為同一元素的同一事件設置多個事件處理程序；如果要為同一元素的同一事件設置多個事件處理程序，那么我們可以使用addEventListener。

此外，如果要在讀取頁面和所有資源（如圖像）后立即執行進程，則使用onload，但如果要在不等待讀取的情況下執行進程，需要使用DOMContentLoaded。

以上是JavaScript中onload事件的使用方法的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！

向AI問一下細節

中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站