>  기사  >  웹 프론트엔드  >  JavaScript 실행 순서에 대한 간략한 소개

JavaScript 실행 순서에 대한 간략한 소개

黄舟
黄舟원래의
2017-03-14 15:12:431492검색

이 글은 JavaScript의 기본에 대한 글입니다. 주로 웹 페이지가 로드된 후 JavaScript가 실행되는 순서를 설명합니다. 이는 JavaScript의 실행 메커니즘을 이해하는 데 매우 중요합니다. 살펴 보겠습니다.

Javascript는 별도로 지정하지 않는 한 페이지가 로드될 때까지 기다리지 않고 실행됩니다. 예를 들어, 웹 페이지에 다음 HTML 코드가 포함되어 있습니다:

<p id="ele">welcome to www.codeceo.com</p>

이 HTML 코드 줄 앞에 다음 Javascript 코드를 추가하면:

<script type="text/javascript">
  document.getElementById(&#39;ele&#39;).innerHTML= &#39;welcome to my blog&#39;;
</script>

페이지를 실행하면 메시지 : "document.getElementById('ele') is null." 이유는 위 자바스크립트를 실행했을 때 ID가 ''인 DOM 요소가 없기 때문입니다. 아직 페이지에 없습니다.

두 가지 해결 방법이 있습니다.

1. HTML 코드 뒤에 자바스크립트 코드를 삽입합니다.

<p id="ele">welcome to www.codeceo.com</p>

2. 웹페이지가 로드될 때까지 기다린 후 자바스크립트 코드를 실행합니다. . 기존 솔루션(로드)을 사용할 수 있습니다. 먼저 HTML 본문을 추가하고 "31e0bd138942fcd55b8cc9494cc91c45"를 추가한 다음 load() 함수 . 여기서 제가 집중하고 싶은 것은 이를 달성하기 위해 jQuery를 사용하는 것입니다:

<script>
$(document).ready(function(){
   document.getElementById(&#39;ele&#39;).innerHTML= &#39;welcome to my blog&#39;;
});
</script>
//当然,既然用到了jQuery,更简单的写法是:
<script>
$(document).ready(function(){
   $(&#39;#ele&#39;).html(&#39;welcome to my blog&#39;); //这里也可用.text()方法
});
</script>

위의 jQuery 코드를 페이지의 어느 곳에나 배치할 수 있으며 페이지가 로드될 때까지 항상 기다립니다. 실행하기 전에.

위 내용은 JavaScript 실행 순서에 대한 간략한 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.