-
스크립트 순서 ready, onload, javascript개발/개발관련 2020. 3. 18. 10:25
1. 외부 내부 스크립트 실행 순서?
<head> <script type="text/javascript" src="/resources/lib/panolens/seoul/js/first.js"></script> <script type="text/javascript" src="/resources/lib/panolens/seoul/js/second.js"></script> </head> <body> <script type="text/javascript"> $(document).ready(function() { alert("html - script - ready 안 4"); }); alert("html - script 태그 안 1"); </script> </body>
html은 이와같고, first.js안에 ready함수가 들어가있고, second.js에는 first.js ready함수안에서 호출하는 함수가 들어있다.
//first.js 안 $(document).ready(function() { alert("first.js안 ready"); }); //second.js 안 aaa: function(){ alert("aaa함수 안"); }
이런식으로 외부 스크립트, 내부 스크립트 짬뽕되어있는 스크립트들의 순서는 어떻게 될까
결론부터 말하자면 아래와 같다.
- alert("html - script 태그 안 1");
- alert("first.js안 ready");
- alert("aaa함수 안");
- alert("html - script - ready 안 4");
2. ready onload 순서
ready 함수는 브라우저가 DOM트리 생성한 직후 실행한다. 그래서 alert("html - script 태그 안 1"); 이후에 first.js에 있는 ready가 실행되면서 aaa함수가 실행되고, 마지막으로 html내부 script의 ready가 실행된거같다.
onload는 쉽게 말하면 화면이 다 뜨고 마지막에 실행된다.
jquery 대신 순수 자바스크립트로 할 수 있다. 그건 구글에 찾아보면 잘 나온다.
728x90'개발 > 개발관련' 카테고리의 다른 글
ie에서 forEach 못쓰는 경우 (1) 2020.04.06 단순 프로젝트 빌드 배포 서버에서 확인 (0) 2020.03.27 ssl 적용하기 (0) 2020.03.10 외부사이트 html 코드 가져오기 (0) 2020.03.05 동영상 해상도 변경해도 이어서 보기 (0) 2020.02.10