2010-03-15 3 views
1

나는이 작업을 훌륭하게 해왔지만, 실제로 장면의 뒤에서 어떤 일이 벌어지고 있는지 더 깊이 이해하고 싶습니다.jquery는 ajax 요청으로부터받은 이미지를 어떻게 표시합니까?

저는 Jquery의 Ajax 메서드를 사용하여 5 개의 블로그 게시물 (제목과 첫 번째 사진 만 반환)을 가져옵니다. PHP 스크립트는 블로그 게시물의 제목과 첫 번째 사진을 잡고 배열에 집어 넣은 다음 JSON이라는 브라우저에 다시 보냅니다.

JSON 개체를 받으면 Jquery는 JSON 개체의 첫 번째 구성원을 잡고 제목과 사진을 표시합니다. 내가 만든 갤러리에서 버튼을 사용하여 사용자는 1-5 개의 게시물을 반복 할 수 있습니다.

실제 AJAX 호출은 즉시 발생하며 한 번만 발생합니다. 나는 기본적으로 $ ('my_div') .html (json_obj [i])와 같은 각 설정을 사용하고있다.

그래서 jquery는 내 컴퓨터 메모리, 웹 브라우저 캐시 또는 자바 스크립트 엔진의 캐시에서 이러한 블로그 게시물을 뽑아 내고 있습니까?

되돌아 오는 것 중 하나는 예쁜 애니메이션 애니메이션 gif입니다. 나는 그것이 지속적으로 백그라운드에서 실행되는지 (보이지는 않지만), 프로세싱 사이클을 훔치는 지 궁금하다. 또는 자바 스크립트가 DOM에 삽입 (플래시 무비라고도 함)하지만, 손이 아무것도하지 않고 약간의 메모리 (처리 없음)를 차지하기 전에.

어쨌든, 나는 단지 호기심입니다. 누군가가 이것에 관해 지도자라면, 나는 당신의 테이크를 듣고 싶습니다. 감사!!

답변

2

반환되는 JSON에는 헤더와 이미지를 표시하는 html이 들어 있습니다.

json에 포함 된 img 요소가 DOM에 추가되면 (<img src="blah">) 브라우저는 실제로 이미지를 캐시로 다운로드합니다. 이 시점에서이 이미지는 웹 브라우저가 이미지를 해석하여 화면에 표시 할 때까지 아무 것도되지 않는 이진 데이터입니다. 애니메이션 GIF는 화면에 실제로 표시 될 때까지 처리주기 또는 추가 메모리를 사용하지 않습니다.

0

배열에 json을 유지하고 클릭하여 DOM을 보내는 것처럼 보입니다. json 배열의 항목은 이런 식으로 모든 처리주기를 사용하지 않습니다.

+0

Ok 플래시와 사진은 DOM에 삽입 될 때까지 단지 바이너리 형태로되어 있습니다. 그 시점에서 플래시와 사진은 활성화됩니다. 알 수 있습니다. 매우 도움이됩니다. 감사! –

1

JavaScript는 아무 것도하지 않습니다. 그것은 당신이 삽입 한 모든 것 (외장 이미지, 텍스트 등의 링크)을 메모리에만 저장합니다. DOM에 삽입하면 브라우저는 외부 서버 나 브라우저 캐시에서 직접로드 할 수있는 텍스트와 그래픽을 표시하여 콘텐츠를 처리합니다.

관련 문제