이 페이지는 어떻게 동적으로 올바른 이미지를로드합니까?

Question

AJAX에 익숙해지면서 나는 이해할 수없는 다음과 같은 문제를 발견했습니다.

일반적으로 온라인 상점에서 제품 결과의 새 페이지를 동적으로로드 할 때 페이지는 원하는 제품 데이터 (예 : 제품 100-200)를 지정하고 수신 된 데이터 (브랜드, 가격, 등).

이 this site을 firebug와 함께 포착하면 제품의 새 페이지가 동적으로로드되면 해당 리소스가 요청되지 않는다는 것을 알게되었습니다. 모든 제품의 모든 데이터 (이미지 제외)는 정적이며 페이지를 전환 할 때 이미지 URL 만 요청됩니다.

큰 이미지의 이름이 정적 페이지에 없다는 것을 감안할 때 페이지에서 요청할 이미지를 어떻게 알 수 있는지 궁금합니다. 페이지 하단의 축소판 이미지 이름이 확장자 (8P_F 대 13P_F)를 제외하고 큰 이미지의 이름과 동일하다는 것을 알았습니다.

개발자는 큰 이미지 요청을하기 위해 미리보기 이미지 이름을 수정하는 것만으로도 짐작할 수 있습니다. 그러나 자바에 대한 지식은 충분하지 않아서 이런 일이 발생하는 곳을 식별 할 수 없습니다. 그게 여기서 벌어지고있는거야?

Answer 1

페이지가 AJAX를 사용하여 이미지를 전혀 얻지 못했다고 생각합니다. Fiddler를 사용하면 화살표를 클릭하면 이미지가 직접 요청됨을 알 수 있습니다. 패키지 이미지 데이터 (예 : URL)는 실제로 반환되지 않습니다. 작은 아이콘에는 기본 이미지 이름 데이터가 있습니다. 나는 그들이 문자열로부터 이것을 제거하고, 다른 문자열을 보류하고 소스 속성을 설정하는 것으로 의심한다.

나는 그들이 단순한 것처럼 상상한다.

var smallImgURL = document.getElementById('smallimageX'); 
var bigImgUrl = smallImgUrl.substring(0, smallImageUrl.indexOf('_')); 
var bigImgUrl += '13P_F'; 
//call a fancy placeholder animation 
document.getElementById('bigimageContainer').src = bigImgUrl; 
//when load completes show image