如果在JS或CSS中没有指定属性,我如何找到JS样式属性的值?

How do I find the value of a JS style property if that property hasn't been specified anywhere in JS or CSS?

本文关键字:属性 JS 何找 样式 CSS 如果      更新时间:2023-09-26

如何找到JS样式属性的值,如果该属性在JSCSS中没有指定任何地方? JS 。没有JQuery或其他库。

当我说属性没有被指定时,我的意思是在我的代码中没有任何地方显式地给它一个值。例如,假设我有一个div标签里面有一些文本:

<div id="item" style="float:left;">This is just random text.</div>

这个div宽度当然会大于0像素,因为里面有文本,但它会小于整行的宽度,因为它是向左浮动的。div的宽度足以容纳里面的所有文本,但我无法确定的宽度是什么,因为我从未指定过它。例如,尝试以下代码:

alert(document.getElementById("item").style.width);

…将返回一个空字符串,因为没有指定宽度。是否有一种方法,虽然页面已经加载和元素已经呈现,检索计算/演示/实际宽度divJS?

我不妨让你知道,顺便说一下,我正试图把几个这样的容器,在上面的例子中随机文本,间隔和居中在同一行。我认为它们必须是div ,因为我需要操纵margin属性来分隔它们(这不能用span 来完成)。为了强制div 放到同一行,必须对它们进行浮动。但是问题就变成了浮动元素对center标签或CSStext-align属性没有响应。因此,唯一剩下的方法来居中的容器是给他们的容器(超级容器)一个宽度和设置其CSSmargin属性为auto。但是我不知道如何设置超级容器的宽度,因为内部容器内的文本会有所不同。因此,我认为最好的做法是计算出每个内部容器的宽度是多少,然后将所有宽度加起来,得到超级容器的宽度。但是,如果你发现这种思路中的缺陷,或者一种更简单的方法,请随时指出来。

欢迎提出建议。谢谢。

获取div宽度所需要的是divID.clientWidth,如下所示:

alert("Div Width: " + divID.clientWidth); 

这是一个演示。

希望这对你有帮助