当前位置：Gxlcms > JavaScript > js和jquery如何获取图片真实的宽度和高度_javascript技巧

js和jquery如何获取图片真实的宽度和高度_javascript技巧

时间：2021-07-01 10:21:17 帮助过：5人阅读

1、什么时候需要获取图片真实的宽度和高度

在做pc网页的时候，有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图。然后判断过后给予不同的展示方式！

另外一种就是在手机页面上，在新闻页插入的图片往往都是按照图片的原尺寸来展示，如果手机屏幕太小，太大的图就会超出去！这时候有两种解决办法

1）给所有的图片加上这样的样式

代码如下:

.news img{margin:5px auto; display:block;width:100%; height:auto;}

但是这种方式有另外一个问题就是，如果插入的图片本身就很小的话，也会被直接拉伸成100%显示，显然这是不合理的！那么这里就介绍另外一种方式就是通过js动态展示图片的尺寸！

2）js动态获取图片的尺寸

jquery方式

代码如下

js方式

代码如下

上面两种方法中jquery比较简单，实现起来比较快，第二种比较复杂些，但是执行起来比jquery要快!

人气教程排行