JavaScript简单获取页面图片原始尺寸的方法


Posted in Javascript onJune 21, 2016

本文实例讲述了JavaScript简单获取页面图片原始尺寸的方法。分享给大家供大家参考,具体如下:

这里通过Image()对象获取原始宽高

这种方式就没有那么麻烦,直接new一个Image()对象,然后把img的src赋值给他即可获取。

var img = new Image();
img.src = $("#target").attr("src");
if(img.complete){
  alert('width:'+img.width+',height'+img.height);
  img = null;
}else{
  img.onload = function(){
    alert('width:'+img.width+',height'+img.height);
    img = null;
  };
}

并且不要担心new Image对象会多一个http请求,浏览器加载图片后已经有缓存,你new N个image对象都没问题,当然,内存会消耗,所以用完后img置为null。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
扩展jquery实现客户端表格的分页、排序功能代码
Mar 16 Javascript
javascript之典型高阶函数应用介绍
Jan 10 Javascript
Jquery选中或取消radio示例
Sep 29 Javascript
自制微信公众号一键排版工具
Sep 22 Javascript
javascript中数组(Array)对象和字符串(String)对象的常用方法总结
Dec 15 Javascript
Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
Jan 20 Javascript
整理一些最近经常遇到的前端面试题
Apr 25 Javascript
BootStrap实现文件上传并带有进度条效果
Sep 11 Javascript
vue项目优化之通过keep-alive数据缓存的方法
Dec 11 Javascript
vue+element实现表格新增、编辑、删除功能
May 28 Javascript
原生JS封装拖动验证滑块的实现代码示例
Jun 01 Javascript
ant design pro中可控的筛选和排序实例
Nov 17 Javascript
第九篇Bootstrap导航菜单创建步骤详解
Jun 21 #Javascript
js简单判断flash是否加载完成的方法
Jun 21 #Javascript
第八篇Bootstrap下拉菜单实例代码
Jun 21 #Javascript
JS实现获取剪贴板内容的方法
Jun 21 #Javascript
第七篇Bootstrap表单布局实例代码详解(三种表单布局)
Jun 21 #Javascript
Javascript打印局部页面实例
Jun 21 #Javascript
第六篇Bootstrap表格样式介绍
Jun 21 #Javascript
You might like
PHP语法速查表
2006/12/06 PHP
php cout<<的一点看法
2010/01/24 PHP
PHP中usort在值相同时改变原始位置问题的解决方法
2011/11/27 PHP
php中使用DOM类读取XML文件的实现代码
2011/12/14 PHP
php实现的九九乘法口诀表简洁版
2014/07/28 PHP
ThinkPHP中的三大自动简介
2014/08/22 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
php验证码实现代码(3种)
2015/09/07 PHP
PHP在线调试执行的实现方法(附demo源码)
2016/04/28 PHP
Laravel5.* 打印出执行的sql语句的方法
2017/07/24 PHP
jQuery数据显示插件整合实现代码
2011/10/24 Javascript
javascript中将Object转换为String函数代码 (json str)
2012/04/29 Javascript
用nodejs实现PHP的print_r函数代码
2014/03/14 NodeJs
用js格式化金额可设置保留的小数位数
2014/05/09 Javascript
ext中store.load跟store.reload的区别示例介绍
2014/06/17 Javascript
轻松创建nodejs服务器(5):事件处理程序
2014/12/18 NodeJs
Jquery promise实现一张一张加载图片
2015/11/13 Javascript
详解使用vue实现tab 切换操作
2017/07/03 Javascript
JS数组操作之增删改查的简单实现
2017/08/21 Javascript
javascript观察者模式实现自动刷新效果
2017/09/05 Javascript
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
2018/05/07 Javascript
vue的style绑定background-image的方式和其他变量数据的区别详解
2018/09/03 Javascript
JS 验证码功能的三种实现方式
2018/11/26 Javascript
js实现tab栏切换效果
2020/08/02 Javascript
BP神经网络原理及Python实现代码
2018/12/18 Python
python实现简单加密解密机制
2019/03/19 Python
python 图片二值化处理(处理后为纯黑白的图片)
2019/11/01 Python
Python 自由定制表格的实现示例
2020/03/20 Python
Python3.7在anaconda里面使用IDLE编译器的步骤详解
2020/04/29 Python
Hotels.com韩国:海外国内旅行所需的酒店和住宿预订网站
2020/05/08 全球购物
读书之星事迹材料
2014/05/12 职场文书
车间核算员岗位职责
2014/07/01 职场文书
慈善捐赠倡议书
2014/08/30 职场文书
公司表扬信格式
2015/05/04 职场文书
活着观后感
2015/06/03 职场文书
利用ajax+php实现商品价格计算
2021/03/31 PHP