JavaScript:获取图片尺寸
我只有一个图像的url。 我只需要使用JavaScript来确定这个图像的高度和宽度。 页面上的用户无法看到图像。 我怎样才能得到它的尺寸?
var img = new Image(); img.onload = function(){ var height = img.height; var width = img.width; // code here to use the dimensions } img.src = url;
制作一个新的Image
var img = new Image();
设置src
img.src = your_src
获取width
和height
//img.width //img.height
这使用该function,并等待它完成。
http://jsfiddle.net/SN2t6/118/
function getMeta(url){ var r = $.Deferred(); $('<img/>').attr('src', url).load(function(){ var s = {w:this.width, h:this.height}; r.resolve(s) }); return r; } getMeta("http://www.google.hrhttp://img.dovov.comsrpr/logo3w.png").done(function(test){ alert(test.w + ' ' + test.h); });
以下代码将图像属性的高度和宽度添加到页面上的每个图像。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Untitled</title> <script type="text/javascript"> function addImgAttributes() { for( i=0; i < document.images.length; i++) { width = document.images[i].width; height = document.images[i].height; window.document.images[i].setAttribute("width",width); window.document.images[i].setAttribute("height",height); } } </script> </head> <body onload="addImgAttributes();"> <img src="2_01.jpg"/> <img src="2_01.jpg"/> </body> </html>
类似的问题在这里使用JQuery进行询问和回答:
从url获取远程图像的宽度高度
function getMeta(url){ $("<img/>").attr("src", url).load(function(){ s = {w:this.width, h:this.height}; alert(s.w+' '+sh); }); } getMeta("http://page.com/img.jpg");