집 > 기사 > 웹 프론트엔드 > 페이지에서 js를 자동으로 실행(로드)하는 여러 솔루션, 자세한 코드 분석

페이지에서 js를 자동으로 실행(로드)하는 여러 솔루션, 자세한 코드 분석

亚连원래의: 2018-05-18 09:42:212346검색

다음은 페이지에서 js를 자동으로 실행(로드)할 수 있도록 컴파일한 몇 가지 솔루션입니다.

1. 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>

2. JQ 방식

1. 전체 페이지의 문서를 모두 로드한 후 실행합니다. 불행하게도 이 방법을 사용하려면 페이지의 DOM 트리가 완전히 로드되어야 할 뿐만 아니라 모든 외부 이미지와 리소스도 로드되어야 합니다. 더욱 안타까운 점은 이미지 등의 외부 리소스를 로드하는 데 시간이 오래 걸리면 이 js 메서드의 실행이 느리게 느껴질 것이라는 점입니다. 즉, 페이지가 로드된 후 메소드를 실행하는 가장 엄격한 방법입니다.

window.onload =function() { $("table tr:nth-child(even)").addClass("even"); //这个是jquery代码 };

2. 브라우저가 모든 HTML을 DOM 트리에 넣기 전에 모든 DOM 구조를 로드하고 메서드를 실행하세요. 외부 이미지 및 리소스를 로드하기 전에 포함됩니다.

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

약어도 있습니다

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

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되길 바랍니다.

페이지에서 js를 자동으로 실행(로드)하는 여러 솔루션, 자세한 코드 분석

관련 기사