2012-05-11 3 views
1

시간에 따라 다른 이미지를 표시하려는 페이지가 있습니다.jquery document 준비 대기 리스너 대 이미지로드; 실행 순서

어떻게이 작업을 jquery 준비 수신기에 연결했습니다. 모든 이미지 요소를 선택하고 시간에 따라 소스를 변경하는 기능이 있습니다. 각 img 태그는 html에 지정된 기본 src를가집니다. 사용자가 js를 비활성화 한 경우 등에 대비합니다.

그러나이 방법을 사용하면 브라우저가 기본 이미지를로드하기 시작하고 시간별 이미지로드가 진행되어 불필요한 오버 헤드가 발생합니다.

제 질문은 이렇습니다. jquery 준비 이벤트에서 img 소스를 변경하면 브라우저가 이미지를로드하기 전에 img src가 변경됩니다.

모든 응답에 감사드립니다. 이 질문이 중복되는 경우 사과 드리지만 jquery 준비 이벤트의 미묘한 차이에 대해서는 100 만 질문이 있습니다.

답변

2

나는 준비된 청취자가 모든 HTML로드가 끝나자 마자 실행을 시작한다. 즉, bg로드 및 준비가 실행될 때까지 기다리지 않는다는 것을 의미한다. 따라서 타이밍에 따라 기본 로딩을 바꿀 수 있습니다.

아마도 이미지의 src 또는 bg의 CSS를 생략하고 ready()에 jquery로만 추가 할 수 있습니다. JS를 사용하지 않도록 사람들을 위해

, 당신이 NOSCRIPT 블록에서 기본 부하를 가질 수있는 것은

+0

검색 엔진의 이익을 위해 항상 src 요소를 지정하고 싶지만, 정확히 알고 싶습니다. 감사! – Tuck

2

당신은 jQuery's documentation에서이 권리에 대한 답을 찾을 수 있습니다

자바 스크립트 코드를 언제 실행에 대한로드 이벤트를 제공하지만 이미지가 완전히 수신되면 페이지가 렌더링되고이 애셋은 모든 애셋 이 수신 될 때까지 트리거되지 않습니다. 대부분의 경우 스크립트는 DOM 계층이 완전히 으로 생성되는 즉시 실행될 수 있습니다.

코드가 있으면 이미지의로드 상태에 관계없이 준비 이벤트가 실행되기 시작합니다. 이는 이미지가 표시되거나 표시되지 않을 수 있음을 의미합니다. 이미지가 완전히로드되거나 부분적으로로드 될 수 있습니다. 변경하는 명령이 수신되기 전에 이미지가 얼마나 빨리로드되는지에 따라 달라집니다.

이미지가로드되지 않았 음을 확실하게 확인하려면 원하는 이미지 만 코드에 기록되도록이 서버 측을 수행해야합니다. 실행에 약간의 지연이있는 경우 변경, 당신은 분명히 기본 이미지의 전체 또는 일부를 볼 수 있습니다.

+0

문서에서 나는 그 의미가 정확히 무엇인지 100 % 아니 었습니다. 그것을 명확히 해줘서 고마워. – Tuck