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 相关文章推荐
一个收集图片的bookmarlet(js 刷新页面中的图片)
May 27 Javascript
jQuery 下拉列表 二级联动插件分享
Mar 29 Javascript
js获取GridView中行数据的两种方法 分享
Jul 13 Javascript
zeroclipboard 单个复制按钮和多个复制按钮的实现方法
Jun 14 Javascript
如何提高数据访问速度
Dec 26 Javascript
Bootstrap Table使用整理(五)之分页组合查询
Jun 09 Javascript
JavaScript之RegExp_动力节点Java学院整理
Jun 29 Javascript
vue-star评星组件开发实例
Mar 01 Javascript
Vuex入门到上手教程
Jun 20 Javascript
ES6知识点整理之模块化的应用详解
Apr 15 Javascript
实现高性能javascript的注意事项
May 27 Javascript
在antd4.0中Form使用initialValue操作
Nov 02 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中三个等号(===)和两个等号(==)的区别
2013/08/06 PHP
PHP使用ob_start生成html页面的方法
2014/11/07 PHP
php使用function_exists判断函数可用的方法
2014/11/19 PHP
PHP面相对象中的重载与重写
2017/02/13 PHP
bcastr2.0 通用的图片浏览器
2006/11/22 Javascript
javascript编程起步(第六课)
2007/01/10 Javascript
用JavaScript对JSON进行模式匹配 (Part 2 - 实现)
2010/07/17 Javascript
判断一个对象是否为jquery对象的方法
2014/03/12 Javascript
jQuery中even选择器的定义和用法
2014/12/23 Javascript
javascript面向对象之this关键词用法分析
2015/01/13 Javascript
jQuery插件实现图片轮播特效
2016/06/16 Javascript
很棒的js Tab选项卡切换效果
2016/08/30 Javascript
AngularJS 实现JavaScript 动画效果详解
2016/09/08 Javascript
jQuery中slidedown与slideup方法用法示例
2016/09/16 Javascript
angular使用post、get向后台传参的问题实例
2017/05/27 Javascript
Vue Router的懒加载路径的解决方法
2018/06/21 Javascript
微信小程序引入Vant组件库过程解析
2019/08/06 Javascript
vue+elementUI实现简单日历功能
2020/09/24 Javascript
vue 实现element-ui中的加载中状态
2020/11/11 Javascript
基于jQuery拖拽事件的封装
2020/11/29 jQuery
微信小程序反编译的实现
2020/12/10 Javascript
vue-router懒加载的3种方式汇总
2021/02/28 Vue.js
python中mechanize库的简单使用示例
2014/01/10 Python
如何解决django配置settings时遇到Could not import settings 'conf.local'
2014/11/18 Python
pandas删除指定行详解
2019/04/04 Python
Python/Django后端使用PIL Image生成头像缩略图
2019/04/30 Python
Python IDE Pycharm中的快捷键列表用法
2019/08/08 Python
opencv3/Python 稠密光流calcOpticalFlowFarneback详解
2019/12/11 Python
Python decimal模块使用方法详解
2020/06/08 Python
python 实现百度网盘非会员上传超过500个文件的方法
2021/01/07 Python
屈臣氏马来西亚官网:Watsons马来西亚
2019/06/15 全球购物
自我鉴定总结
2014/03/24 职场文书
医学专业毕业生推荐信
2014/07/12 职场文书
2015年环保局工作总结
2015/05/22 职场文书
初中化学教学反思
2016/02/22 职场文书
MySQL一劳永逸永久支持输入中文的方法实例
2022/08/05 MySQL