<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
</head>
<body onload="realWidth()">
<img src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png" id="image" style="width:25px;height:25px;">
<!-- 页面加载完毕才可获取图片的宽和高 -->
<script>
function realWidth(){
var real_width,real_height;
im = document.createElement('img');
im.src = document.getElementById('image').src;
alert(im.width+'\n'+im.height);
}
</script>
</body>
</html>Jquery使用示例：
<img width="200" class="images_details" src="http://localhost/Public/images/icon/banner.jpg" alt="" />
// 获取图片原始宽度
var Image = document.createElement('img');
$('.images_details').each(function (i){
Image.src = $(this).prop('src');
RealWidth = Image.width;
if(RealWidth > 450){
RealWidth = 450;
}
$(this).attr('_width',RealWidth);
});
// 显示图片原始宽度
$('.images_details').click(function (i){
ShowWidth = $(this).attr('_width')
CurrentWidth = $(this).prop('width');
if(ShowWidth == CurrentWidth){
$(this).prop('width',200);
}else{
$(this).prop('width',ShowWidth);
}
});