Javascript 对span id使用getElementById时没有结果

我需要获取图像的当前宽度，所以我尝试了一些javascript。请注意，我正在使用Zen Cart，因此向img src添加类不是一个选项，因为图像是使用以下代码输出的

<?php echo zen_image(DIR_WS_IMAGES . $categories_image, '', SUBCATEGORY_IMAGE_TOP_WIDTH, SUBCATEGORY_IMAGE_TOP_HEIGHT); ?>

如果我输出到console.log，它将返回0

但是，如果我将跨度更改为

<div id="imageContainer">

然后它正确地返回图像的大小，但是，我不能使用div，因为一旦视口增加到图像的宽度之外，div就会超出图像的大小

---

所以问题是，

document.getElementById

为什么不在

span

上工作，有没有办法解决这个问题？

这是因为

span

是一个内联元素，而div是一个

块
元素

在文件中明确提到

对于没有CSS或CSS的元素，Element.clientWidth属性为零
内联布局框，否则为中元素的内部宽度
像素。它包括填充，但不包括垂直滚动条（如果需要）
当前（如果渲染），边框或边距

发件人：

对于没有CSS或CSS的元素，Element.clientWidth属性为零
内联布局框

改为使用属性，该属性对内联元素有效：


var s=document.getElementById（'imageContainer'）；
console.log（s.offsetWidth）

这是一个测试
确实对元素起作用，问题是不起作用。这是因为
是一个，因此没有设置或是一个，因此有一个默认的
宽度，这就是为什么可以使用JavaScript输出它

这可以从以下几点看出：


var span=document.getElementById（'example'）；
log（span.innerHTML）；
console.log（span.clientWidth）；
var div=document.getElementById（'example2'）；
log（div.innerHTML）；
console.log（div.clientWidth）
Span
Div
摘要
在执行getElementById时，您声明没有得到任何结果

问题
您已经收集了将元素从SPAN标记更改为DIV所需的数据，这是许多人经常犯的错误

重要的是要知道SPAN标记仅用于包含文本，主要用于向段落的某一部分添加样式，例如：

<p>
   Welcome to stackoverflow, an <span>online community</span> of developers
</p>


欢迎来到stackoverflow，一个开发者的在线社区


这将允许您使用CSS或突出显示文本等专门格式化在线社区

Div元素可以包含的不仅仅是文本，因此在查询时会返回额外的结果

回答得很好，比我自己的回答好得多-给出的分数
<div id="imageContainer">

<p>
   Welcome to stackoverflow, an <span>online community</span> of developers
</p>