JavaScript (Internet Explorer)에서 스타일이 지정되지 않은 이미지의 너비는 어떻게 알 수 있습니까?

Question

는 내가 jQuery를 사용하지 않고 너비와 이미지의 높이를 알아 내기 위해 할 수있는

img = document.createElement("img"); 
    img.src = "MahImage.jpg"; 
    x.appendChild(img); 

다음 당신이 상상?

나는 현재 어떤 지능 브라우저 잘 작동하는 .width 사용하고,하지만 난 당신이 속성 width 및 height에 액세스 할 수 있습니다 이미지로드의 후

Answer 1

IE 행복하게 할 수있는 방법을 찾아야한다. 예를 들어

:

alert(img.height + img.width); 

에는 이미지의 사용을 onload hanler로드 알고 속성 clientHeight 및 clienWidth

를 사용하여 이미지 크기를 얻을 수 있습니다. 예를

img = document.createElement("img"); 
img.src = "MahImage.jpg"; 
img.onload = imageproperties; 
x.appendChild(img); 

function imageproperties() { 
    alert(img.height + img.width); 
} 

Answer 2

된 이미지의 width 및 height 속성에 액세스 할 수 있습니다,하지만 그들은 단지 이미지가로드 된 후에 유용한 값을 반환에 대한

; 그래서 당신은 이미지의 onload 이벤트 내에서 그것들에 접근하기를 원할 것입니다.

img = document.createElement("img"); 
img.onload = function() { 
    this.height; 
    this.width; 
}; 
img.src = "MahImage.jpg"; 
x.appendChild(img); 

당신이 여기서 일하는 볼 수 있습니다 http://jsfiddle.net/aS7a7/

Answer 3

당신이로드가 완료되는 때까지 이미지의 높이/폭을 찾을 수 없습니다 때문 까다 롭습니다. 즉, 이미지의로드에 콜백이 첨부되어야합니다.

var img = document.createElement("img"); 
img.src = "MahImage.jpg"; 
img.onload = imageReady; 
x.appendChild(img); 

var imageReady = function() { 
    alert(img.height); 
    alert(img.width); 
} 

Answer 4

이미지가로드 될 때까지 기다려야합니다. 다음은 Chrome에서 테스트 한 코드입니다.

img = document.createElement("img"); 
img.src = "http://google.ru/logos/2011/Albert_Szent_Gyorgyi-2011-hp.jpg"; 
img.onload = function(){ 
    console.log(img.width, img.height); 
} 
document.getElementsByTagName('body')[0].appendChild(img);