JavaScript自啟動
JavaScript是前端開發中不可缺少的一項技術，在Web開發中被廣泛應用。常見的用途包括動態網頁、表單驗證、AJAX交互等。但是，有些時候我們需要讓JavaScript代碼在頁面加載完成后自動啟動，而不是等待用戶的觸發事件。在本篇文章中，我們將探討如何實現JavaScript自啟動。
為什么要自啟動？
JavaScript自啟動常常被應用在以下場景：
- 頁面加載后立即執行。
- 提供頁面的初始值。
- 當頁面中有Ajax請求時，需要在頁面加載后馬上啟動。
- 啟動輪播圖或其他前端組件。
方法一：window.onload方法
使用window.onload方法可以在頁面加載完成后自動啟動JavaScript代碼。
<html>
<head>
<title>JavaScript自啟動</title>
</head>
<body>
<h1>JavaScript自啟動</h1>
<script>
window.onload = function() {
// 在頁面加載完成后啟動的代碼
alert("Hello World!");
}
</script>
</body>
</html>以上代碼中，window.onload方法會在頁面加載完成后啟動function()中的代碼。
方法二：setTimeout方法
setTimeout方法可以在頁面加載完成n毫秒后啟動JavaScript代碼，其中n為數字。下面是一個例子：
<html>
<head>
<title>JavaScript自啟動</title>
</head>
<body>
<h1>JavaScript自啟動</h1>
<script>
setTimeout(function() {
// 在頁面加載完成n毫秒后啟動的代碼
alert("Hello World!");
}, 1000); // 延遲1000毫秒（1秒）啟動
</script>
</body>
</html>以上代碼中，setTimeout方法會在頁面加載完成后等待1000毫秒（1秒）后啟動function()中的代碼。
方法三：IIFE
IIFE（Immediately Invoked Function Expression）即立即執行函數。通過IIFE可以在定義函數后立即執行，例如：
<html>
<head>
<title>JavaScript自啟動</title>
</head>
<body>
<h1>JavaScript自啟動</h1>
<script>
(function() {
// 立即啟動的代碼
alert("Hello World!");
})();
</script>
</body>
</html>以上代碼中，定義了一個匿名函數，并立即執行其中的代碼。
方法四：jQuery $(document).ready()
JQuery的$(document).ready()方法也可以在頁面加載完成后自動啟動JavaScript代碼。
<html>
<head>
<title>JavaScript自啟動</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<h1>JavaScript自啟動</h1>
<script>
$(document).ready(function() {
// 在頁面加載完成后啟動的代碼
alert("Hello World!");
});
</script>
</body>
</html>以上代碼中，$(document).ready()方法會在頁面加載完成后啟動function()中的代碼。
總結
以上四種方法都可以在頁面加載完成后自動啟動JavaScript代碼，不同的是它們的具體實現方式不同。開發者可以根據自己的需求選擇合適的方法實現JavaScript自啟動。