js 進入頁面載入的方法

weixin_43069179發表於2020-11-12
JS

js 進入頁面執行的5種方式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="https://cdn.staticfile.org/jquery/2.0.0/jquery.min.js">
		</script>
	</head>
	<body onload="load();"> 

	 <div> 
		我是父級div
		<div id="div_1"></div>
		<div id="div_2"></div>
	 </div>
	 <script>
		/* //第一種
		$(function(){
			$("#div_1").html("我是子級div_1");
			document.getElementById("div_2").innerHTML="我是子級div_2";
		})
		 */
		/* 
		//第二種
		$(document).ready(function (){
			$("#div_1").html("我是子級div_1");
			document.getElementById("div_2").innerHTML="我是子級div_2";
		})
		//或者下面這個方法，jQuer的預設引數是：“document”；
		$().ready(function(){
		    //do something
		})
		 */
		/*//第三種
		$(window).ready(function (){
			$("#div_1").html("我是子級div_1");
			document.getElementById("div_2").innerHTML="我是子級div_2";
		}) */
		/* 
		//第四種 原生
		window.onload = function(){
			$("#div_1").html("我是子級div_1");
			document.getElementById("div_2").innerHTML="我是子級div_2";
		} 
		//或者經常用到的圖片
		document.getElementById("imgID").οnlοad=function(){
		     //do something
		}
		*/
		
		/*
		//第五種
		 function load(){
			$("#div_1").html("我是子級div_1_5");
			document.getElementById("div_2").innerHTML="我是子級div_2_5";
		}
		window.οnlοad=load; */
	 </script>
	</body>
</html>

相關文章