Có thể lấy chiều cao/chiều rộng của hình ảnh không có trong DOM không?

Question

Có thể lấy chiều cao và chiều rộng của hình ảnh trong hệ thống tệp bằng JavaScript (tức là hình ảnh không phải là một phần của DOM) không? Hoặc tôi sẽ phải sử dụng JavaScript để chèn hình ảnh vào DOM và lấy kích thước theo cách đó?

Tôi hỏi vì tôi đang viết phương pháp JavaScript để hiển thị thành phần giao diện người dùng được tạo bởi Raphaël, có ba đường dẫn hình ảnh như một phần của tham số phương thức. Sau đó, chúng được sử dụng để hiển thị thành phần giao diện người dùng nói trên và tôi cần kích thước của hình ảnh cho mục đích định vị.

Xin cảm ơn trước.

Answer 1

Tôi nghĩ rằng miễn là hình ảnh đã được nạp, bạn có thể lấy chiều rộng và chiều cao - bạn không cần phải tiêm nó vào DOM mặc dù. Ví dụ:

var tmp = new Image(); 
tmp.onload = function() { 
    console.log(tmp.width + ' x ' + tmp.height); 
} 
tmp.src = 'http://cdn.sstatic.net/stackoverflow/img/sprites.png?v=4'; 

Answer 2

Có thể lấy chiều cao và chiều rộng của hình ảnh trong hệ thống tệp bằng JavaScript (tức là hình ảnh không thuộc DOM) không?

• Không

Hoặc tôi sẽ phải sử dụng JavaScript để tiêm hình ảnh vào DOM và lấy kích thước như vậy?

• Có

Answer 3

Bạn có thể tải hình ảnh với mã:

var img=new Image(),imgWidth,imgHeight; 
img.onerror=img.onload=function(ev) { 
    ev=ev||event; 
    if(ev.type==="error") { 
    imgWidth=imgHeight=-1; // error loading image resourse 
    } 
    else { 
    imgWidth=this.width; // orimgWidth=img.width 
    imgHeight=this.height; // imgHeight=img.height 
    } 
} 
img.src="url_to_image_file"; 

Answer 4

Bạn có thể không nhất thiết phải nhận được để "hệ thống tập tin", nhưng bạn có thể làm điều này:

v = new Image(); 
v.onload = function() { 
    alert("size: " + String(v.width) + 'x' + String(v.height)); 
}; 
v.src = "http://www.gravatar.com/avatar/96269f5a69115aa0e461b6334292d651?s=32&d=identicon&r=PG"; 

Sẽ bạn tính rằng "thêm vào DOM"?