> 웹 프론트엔드 > JS 튜토리얼 > jQuery 지원 함수 남용 분석_jquery

jQuery 지원 함수 남용 분석_jquery

WBOY
풀어 주다: 2016-05-16 18:10:32
원래의
983명이 탐색했습니다.

이전에 작성한 코드를 확인해보세요.

코드 복사 코드는 다음과 같습니다.

$(function(){
//뭔가를 수행합니다.
})

일부 초기화 스타일을 작성하고 이벤트 처리를 다른 DOM 요소에 연결할 수 있습니다. 등. 처음에는 문제가 발견되지 않았지만 페이지에서 다운로드 속도가 느린 일부 이미지를 참조할 때 문제가 발생했습니다. 페이지 HTML이 다운로드되고 모든 리소스가 다운로드되는 사이에 DOM 요소에 바인딩된 이벤트가 혼란스러운 상황에서 실행될 수 없습니다. 예를 들어 스크립트에 바인딩된 잘못된 스타일, 즉 Ready 실행 여부 등입니다.

제 상황은 매우 특별합니다. 아마도 대부분의 학생들이 이런 상황에 직면할 수는 없을 것입니다. 하지만 개발 중에는 더 나쁜 상황에서 사용자가 귀하의 웹사이트를 열게 된다는 점을 고려해야 합니다. 페이지에 많은 이미지가 있습니다. . . 그러면 그는 기다릴 수 밖에 없습니다. . .

해결책: 기본으로 돌아가기
ready가 나타나기 전의 작성 방법은 다음과 같았을 것입니다.

문서에 스크립트 블록 삽입
코드 복사 코드는 다음과 같습니다.

hello world ;script type= "text/javascript">
alert(document.getElementById("test1").innerHTML);


여기에 로드됩니다. 브라우저에서 실행됩니다. 여기서 DOM 요소 test1이 스크립트 블록 뒤에 있으면 여기서 예외가 발생합니다.

페이지가 로드될 때 이 코드를 실행하면 됩니다. 페이지의 모든 리소스를 로드할 필요가 없으므로 여기 앉아서 "느린" 메시지를 기다릴 필요가 없습니다. " 준비가 된.

글쎄, 생각해보고 html 구조를 정리하세요.
페이지 곳곳에 스크립트 블록을 두는 것은 좋지 않습니다. 읽기에 도움이 되지 않으니 그냥 정리해서 아래로 드래그하세요. 문서의 끝.

코드 복사 코드는 다음과 같습니다.
head>
//제목, 메타, 링크 등 멋진 것들을 여기에 넣어보겠습니다.


본문 html…
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿