Question

我想获取图片HTML元素的宽度和高度。我不想要任何默认样式，这些样式由浏览器或计算样式应用。

以下是一些例子：

<img src="" alt="" width="200px" height="100px" />

结果：w = 200，h = 200

<img src="" alt="" height="100px" style="width: 150px;"/>

结果：w = 150，h = 200

<div style="width: 200px; height: 50px;>
    <img src="" alt="" style="width: 150px;"/>
</div>

结果：w = 150 h = Null

所以，如果通过内联css或旧标签设置，我想得到宽度/高度。不需要外部。如果没有具体设置宽度，我想得到null。

我该怎么做？我试过了：

$(this).height;
$(this).css('height');

没用。我唯一能想到的就是用以下方式获取样式字符串：

$(this).find('style');

并对其应用正则表达式。对于width和height标签，应该可以使用：

$(this).attr('width');

没有测试过，因为如果我没有style =“”那就没用了。

由于

Answer 1

您是否尝试过.height()和.width()？

Answer 2

不确定但是试试这个：

$(this).height();

Answer 3

看起来.height（）和.width（）无法完全运行：

http://jsfiddle.net/Tszjs/12/

该示例显示，如果宽度或高度都存在内联样式，则将忽略旧的height =“x”和width =“y”属性。

我建议您在代码中检查旧属性以查看它们是否存在以及它们是否将它们与内联样式覆盖相结合。例如：

<img id="test2" src="" alt="" height="100px" style="width: 150px;" />
<script>
var test2= $("#test2");
var oldHeight=test2.attr("height");
var oldWidth=test2.attr("width");
var myHeight,myWidth;

if(oldHeight!=undefined) { myHeight=oldHeight; } else { myHeight=test2.height();} 
if(oldWidth!=undefined) { myWidth=oldWidth; } else { myWidth=test2.width();} 

document.write("CORRECT ---- Height: " +  myHeight + "px - Width: " +  myWidth + "px<br />");
</script>

使用js获取<img/>的宽度/高度。没有计算的样式

3 个答案: