본문 또는 HTML 헤드에 스크립트를 작성해야합니까? [복제]
이 질문에는 이미 답변이 있습니다.
두 가지 방법을 보았습니다. 두 가지 구현 작업은 구조가 약간 다릅니다. 당신의 경험에서 어떤 것이 더 잘 작동합니까?
나는 실제로 여러 옵션으로 이것을 대답하고 싶습니다. 일부는 실제로 몸에 렌더링됩니다.
- jQuery 라이브러리와 같은 라이브러리 스크립트를 헤드 섹션에 배치하십시오.
- 성능 / 페이지로드 문제가되지 않는 한 일반 스크립트를 헤드에 배치하십시오.
- 포함과 관련하여 포함과 관련된 스크립트를 포함 시키십시오. 이에 대한 한 가지 예는 asp.net 페이지의 .ascx 사용자 정의 컨트롤입니다. 해당 마크 업의 끝에 스크립트를 배치하십시오.
- 본문 끝 (본문 닫기 전)의 페이지 렌더링에 영향을주는 스크립트를 배치합니다.
- 마크 업에 스크립트를 배치하지 마십시오
<input onclick="myfunction()"/>. 대신 스크립트 본문의 이벤트 핸들러에 배치하는 것이 좋습니다. - 결정할 수없는 경우 페이지 차단 문제와 같은 이유가 없을 때까지 헤드에 넣으십시오.
각주 : "필요하고 사전에 필요하지 않은 경우"는 페이지를 차단할 때 마지막 항목에 적용됩니다 (인식 로딩 속도). 사용자가 인식하는 것은 현실적입니다. 더 빨리로드되도록 인식되면 더 빨리로드됩니다 (물건은 여전히 코드에서 발생).
편집 : 참조 :
- asp.net 토론 : http://west-wind.com/weblog/posts/154797.aspx 및 여기 : http://msdn.microsoft.com/en-us/library/3hc29e2a.aspx
- jQuery 문서 준비 토론 : http://encosia.com/2010/08/18/dont-let-jquerys-document-ready-slow-you-down/?utm_source=feedburner&utm_medium=email&utm_campaign=Feed%3A+Encosia+%28Encosia% 29
- 이 질문에 대한 다른 답변은 유효한 정보도 제시합니다.
- www.google.com 및 www.bing.com을 사용하여 관련 정보를 검색합니다 (참조가 많음)
사이드 참고 : 마크 업 내에서 스크립트 블록을 배치하면, (숨겨진 사업부에서 개최 그들 때문에 (이 문제를 것으로 알려져있다 IE7, 오페라 9.2) 공간을 차지하여 특정 브라우저에서 레이아웃에 영향을 줄 수와 같은 CSS 클래스를 사용 : .hide { display: none; visibility: hidden; }온 div)
표준 : 표준을 사용하면 문제가있는 경우 거의 모든 위치에 스크립트 블록을 배치 할 수 있습니다. http://www.w3.org/TR/1999/REC-html401-19991224/sgml/dtd.html 및 http : // www.w3.org/TR/xhtml11/xhtml11_dtd.html
EDIT2 : 가능할 때마다 (항상?) 실제 Javascript를 외부 파일에 넣고 참조해야합니다. 이는 적절한 시퀀스 유효성을 변경하지 않습니다.
페이지 헤드에서 스크립트를 작성하는 데 문제가 있습니다. 스크립트는 다운로드, 파싱 및 실행될 때까지 페이지 처리를 중지해야합니다. 그 이유는 매우 분명합니다.이 스크립트는 렌더링 결과를 변경하여 페이지에 더 많이 삽입 할 수 있으며 렌더링 할 필요가없는 것을 제거 할 수도 있습니다.
최신 브라우저 중 일부는 스크립트 다운로드를 차단하지 않음으로써 (즉, 8이 처음 임)이 규칙을 위반하지만 전체 다운로드는 차단에 소요 된 시간의 대부분이 아닙니다.
더 빠른 웹 사이트도 확인하십시오. 방금 읽은 후 페이지 하단에 스크립트를 포함하여 렌더링을 완료 할 수 있도록 스크립트를 포함하는 모든 빠른 방법을 살펴 봅니다 (더 나은 UX).
W3Schools는 이 주제에 관한 좋은 기사를 가지고 있습니다 .
스크립트 <head>
스크립트가 호출되거나 이벤트가 트리거 될 때 실행될 스크립트는 기능에 배치됩니다.
기능을 헤드 섹션에 두십시오. 이러한 방식으로 모든 기능이 한 곳에 있으며 페이지 내용을 방해하지 않습니다.
스크립트 <body>
스크립트를 함수 내에 배치하지 않으려는 경우 또는 스크립트가 페이지 내용을 작성해야하는 경우 본문 섹션에 배치해야합니다.
헤드 또는 바디 태그를 닫기 전. DOM이 JS를로드하면 jQuery document.ready와 정확히 일치합니다.
나는 항상 스크립트를 헤더에 넣습니다. 내 이유 :
- 코드와 (정적) 텍스트를 분리하고 싶습니다.
- 일반적으로 외부 소스에서 스크립트를로드합니다.
- 동일한 스크립트가 여러 페이지에서 사용되므로 포함 파일과 같은 느낌이 듭니다 (헤더에도 포함됨)
'IT' 카테고리의 다른 글
| ssh를 극복하는 적절한 방법 (0) | 2020.06.28 |
|---|---|
| Spring Data-JPA와 JPA : 차이점은 무엇입니까? (0) | 2020.06.27 |
| Android 용 XML 속성의 물음표 (?) (0) | 2020.06.27 |
| 클래스 유형을 함수 매개 변수로 전달하는 방법 (0) | 2020.06.27 |
| iOS5 SDK의 자동 참조 계산에 대한 몇 가지 질문 (0) | 2020.06.27 |