JS函數會自動執行（載入）的三種方法-js教程-PHP中文網

首頁

web前端

js教程

JS函數會自動執行（載入）的三種方法

PHPz

Apr 02, 2017 pm 04:13 PM

這篇文章主要為大家詳細介紹了網頁中JS函數自動執行常用三種方法，有興趣的小夥伴們可以參考一下

##一、JS方法 #1.最簡單的呼叫方式，直接寫到html的body標籤裡面：

<body onload="myfunction()">
<html> <body onload="func1();func2();func3();"> </body> </html>

2.在JS語句呼叫：

<script type="text/javascript">
　　function myfun() 　　
{ 　　 alert("this window.onload"); 　　} 　　/*用window.onload调用myfun()*/　　
window.onload = myfun;//不要括号
</script>

第三種

<script type="text/javascript">
window.onload=function(){
func1();
func2();
func3(); }
</script>

二、JQ方法

1.整個頁面的document全部載入完成以後執行。不幸的這種方式不僅要求頁面的DOM tree全部載入完成，而且要求所有的外部圖片和資源全部載入完成。更不幸的是，如果外部資源，例如圖片需要很長時間來加載，那麼這個js方法執行感覺就比較慢了。也就是說這是一種最嚴謹的頁面載入完再執行方法的方法。

window.onload =function() { $("table tr:nth-child(even)").addClass("even"); //這是jquery程式碼};

2.只需要載入所有的DOM結構，在瀏覽器把所有的HTML放入DOM tree之前就執行方法。包括在載入外部圖片和資源之前。

$(document).ready(function() { $("table tr:nth-child(even)").addClass("even"); //任何需要執行的js特效});

還有一種簡寫方式

$(function() { $("table tr:nth-child(even)"). addClass("even"); //任何需要執行的js特效});

#在網頁中JS函式自動執行常用三種方法

在HTML中的Head區域中，有以下函數：

<SCRIPT  LANGUAGE="JavaScript"> 

　　functionn MyAutoRun()

　　{ 

　　　//以下是您的函数的代码，请自行修改先！

　　　alert("函数自动执行哦！"); 

　　} 

</SCRIPT>

下面，我們就針對上面的函數，讓其在網頁載入的時候自動運行！

①第一種方法

將如上程式碼改為：

<SCRIPT  LANGUAGE="JavaScript"> 

　　functionn MyAutoRun()

　　{ 

　　　//以下是您的函数的代码，请自行修改先！

　　　alert("函数自动执行哦！"); 

　　} 

　　window.onload=MyAutoRun(); //仅需要加这一句

</SCRIPT>

②第二種方法

修改網頁的Body為：

或改為：

③第三種方法

使用JS計時器來間斷性的執行函數：

setTimeout("MyAutoRun()",1000 ); //隔1000毫秒就執行一次MyAutoRun()函數實作方法，將最上面的那JS函數，改為：

<SCRIPT  LANGUAGE="JavaScript"> 

　　functionn MyAutoRun()

　　{ 

　　　//以下是您的函数的代码，请自行修改先！

　　　alert("函数自动执行哦！"); 

　　} 

　　setTimeout("MyAutoRun()",1000); //这样就行拉

</SCRIPT>

其它的方法比較特殊，也不常用，通用性也不大，就不介紹了！

以上是JS函數會自動執行（載入）的三種方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

C和JavaScript：連接解釋Apr 23, 2025 am 12:07 AM

C 和JavaScript通過WebAssembly實現互操作性。 1）C 代碼編譯成WebAssembly模塊，引入到JavaScript環境中，增強計算能力。 2）在遊戲開發中，C 處理物理引擎和圖形渲染，JavaScript負責遊戲邏輯和用戶界面。

從網站到應用程序：JavaScript的不同應用Apr 22, 2025 am 12:02 AM

JavaScript在網站、移動應用、桌面應用和服務器端編程中均有廣泛應用。 1)在網站開發中，JavaScript與HTML、CSS一起操作DOM，實現動態效果，並支持如jQuery、React等框架。 2)通過ReactNative和Ionic，JavaScript用於開發跨平台移動應用。 3)Electron框架使JavaScript能構建桌面應用。 4)Node.js讓JavaScript在服務器端運行，支持高並發請求。

Python vs. JavaScript：比較用例和應用程序Apr 21, 2025 am 12:01 AM

Python更適合數據科學和自動化，JavaScript更適合前端和全棧開發。 1.Python在數據科學和機器學習中表現出色，使用NumPy、Pandas等庫進行數據處理和建模。 2.Python在自動化和腳本編寫方面簡潔高效。 3.JavaScript在前端開發中不可或缺，用於構建動態網頁和單頁面應用。 4.JavaScript通過Node.js在後端開發中發揮作用，支持全棧開發。

C/C在JavaScript口譯員和編譯器中的作用Apr 20, 2025 am 12:01 AM

C和C 在JavaScript引擎中扮演了至关重要的角色，主要用于实现解释器和JIT编译器。1）C 用于解析JavaScript源码并生成抽象语法树。2）C 负责生成和执行字节码。3）C 实现JIT编译器，在运行时优化和编译热点代码，显著提高JavaScript的执行效率。

JavaScript在行動中：現實世界中的示例和項目Apr 19, 2025 am 12:13 AM

JavaScript在現實世界中的應用包括前端和後端開發。 1)通過構建TODO列表應用展示前端應用，涉及DOM操作和事件處理。 2)通過Node.js和Express構建RESTfulAPI展示後端應用。

JavaScript和Web：核心功能和用例Apr 18, 2025 am 12:19 AM

JavaScript在Web開發中的主要用途包括客戶端交互、表單驗證和異步通信。 1)通過DOM操作實現動態內容更新和用戶交互；2)在用戶提交數據前進行客戶端驗證，提高用戶體驗；3)通過AJAX技術實現與服務器的無刷新通信。

了解JavaScript引擎：實施詳細信息Apr 17, 2025 am 12:05 AM

理解JavaScript引擎內部工作原理對開發者重要，因為它能幫助編寫更高效的代碼並理解性能瓶頸和優化策略。 1)引擎的工作流程包括解析、編譯和執行三個階段；2)執行過程中，引擎會進行動態優化，如內聯緩存和隱藏類；3)最佳實踐包括避免全局變量、優化循環、使用const和let，以及避免過度使用閉包。