일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?

青灯夜游
풀어 주다: 2022-09-16 16:20:23
원래의
12114명이 탐색했습니다.

스크립트 태그의 위치: 1. head 태그 안에 넣습니다. 브라우저는 스크립트 태그를 구문 분석할 때 먼저 모든 스크립트를 다운로드한 다음 웹의 내용을 구문 분석합니다. 페이지가 지연되어 렌더링되고 사용자 경험이 좋지 않습니다. 2. body 태그 안에 배치하면 브라우저는 먼저 전체 HTML 페이지를 구문 분석한 다음 js를 다운로드하여 구문 분석합니다. 3. 본문 닫는 태그 뒤에 배치하면 브라우저는 이전의 ""를 무시하므로 실제 효과는 본문 닫는 태그 앞에 쓰는 것과 다르지 않습니다.

일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?

이 튜토리얼의 운영 환경: Windows 7 시스템, HTML5 버전, Dell G3 컴퓨터.

일반적으로 스크립트 태그는 head나 tail에 위치하며, tail은 body 닫는 태그 뒤에 배치됩니다.

1. script 태그는 head 태그 안에 위치합니다.

    <title>获取DOM元素</title>
    <script>
        var myElement = document.getElementById("atag");
        console.log(myElement);
    </script>


    <div>
        <p>一个标签</p>
    </div>
로그인 후 복사

인쇄 결과:

일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?
script 태그가 head 태그 안에 위치하면 브라우저는 script 태그를 구문 분석합니다. 먼저 모든 스크립트를 다운로드한 다음 다른 HTML을 구문 분석합니다. 브라우저가 js를 다운로드할 때 여러 js를 동시에 다운로드할 수 없으며, 브라우저가 js를 다운로드할 때 다른 HTML의 구문 분석을 차단합니다. 따라서 스크립트 태그를 헤드에 배치하면 웹 콘텐츠 렌더링이 지연되고 사용자 경험이 저하됩니다.

2. body 태그 안에 script 태그를 넣습니다.

    <div>
        <p>一个标签</p>
    </div>
<script>
    var myElement = document.getElementById("atag");
    console.log(myElement);
</script>
로그인 후 복사

일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?

script 태그를 body 태그 안에 넣습니다. 브라우저는 먼저 전체 HTML 페이지를 구문 분석한 다음 js를 다운로드합니다. js 실행에 오류가 있는 경우 DOM 문서가 위에서 아래로 실행되기 때문에 최소한 페이지의 요소는 계속 로드될 수 있습니다. 그러나 js에 크게 의존하는 일부 웹페이지의 경우 이는 매우 느리게 나타납니다.

3.script 태그는 body 닫는 태그 뒤에 위치합니다

    <div>
        <p>一个标签</p>
    </div>

<script>
    var myElement = document.getElementById("atag");
    console.log(myElement);
</script>
로그인 후 복사

일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?

body 닫는 태그 전후로 인쇄 결과는 동일하지만 에서 시작하는 body 닫는 태그 뒤에 위치합니다. HTML 2.0 표준 이하입니다. 브라우저가 오류를 보고하지 않는 이유는 스크립트나 요소의 시작 태그가 body 태그 뒤에 나타나면 문구 오류(구문 오류)가 되기 때문입니다. ) 및 브라우저 이전

위 내용은 일반적으로 HTML에서 스크립트 태그는 어디에 작성되나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿