在尝试计算隐藏元素的宽度时，我发现 jquery.width() 为该元素的宽度返回 0。
我发现使用 jquery.css('width') 将通过使用声明的样式宽度返回正确的宽度（即使该值与初始样式表不同）。问题是 css('width') 方法返回一个字符串，通常以“100px”的方式返回。我的问题解决为：如何从“100px”字符串中检索数字？ 有什么简单的方法吗？
【问题讨论】：
标签： javascript jquery css numbers width
如果它总是以 px 格式返回，“100px”、“50px”等（即不是“em”或百分比），你可以...
var width = parseInt($("#myelem").css("width"),10); // always use a radix
或
var width = parseInt(element.style.width,10); // always use a radix
它忽略了“px”后缀，所以你应该很高兴。
虽然我内心深处认为如果 $("#myelem").width() 不起作用，那是有问题的。
注意隐藏元素。
如果您正在添加 jQuery 以逐步增强页面，则您正在计算的元素应该在页面首次加载时可见。因此，您应该在最初隐藏元素之前获取宽度。通过这样做， $("#myelem").width() 将起作用。
var myWidth = 0;
$(document).ready( function () {
myWidth = $("#myelem").width();
$("#myelem").hide();
});
【讨论】：
.width() 不起作用的原因是，如果对象被.hide()(display: none) 隐藏，它们不会对布局做出贡献，因此没有宽度。
.ready() 事件中计算的，并且在每个调整大小回调事件中我必须重新计算 - 使用 .width() - 并应用新值。因此，即使元素被隐藏，我也会拥有当前值。
Number($elem.css('width').replace(/[^\d\.]/g, '')); - 正则表达式结合转换为数字解决了px/em/% 问题。
10 基数的浏览器的问题。
哦，我想出了：
new Number($elem.css('width').slice(0, -2));
//to extract the 'px' and return a regular number
现在我只希望 jquery 总是返回相同的字符串时尚：“100px”
【讨论】：
px，它就会出现。但是，如果您有一些宽度为%，它将返回为50%，并且您的切片函数将修剪最右边的数字。您可以使用indexOf 来测试px 的安全性。
px、em、%、pt）js：Number(elem.style.width.replace(/[^\d\.]/g, '')); 或 jQuery：Number($elem.css('width').replace(/[^\d\.]/g, ''));
我会坚持使用.width()，因为它实际上获得了计算的宽度而不是 css 宽度。而不是用.hide() (display: none) 隐藏它，你可以用.css('visible', 'hidden') 隐藏它，然后.width() 应该可以工作。
来自我的评论
如果你不想改变你的.hide()´s 那么你可以申请visible: hidden 然后.show() 然后测量高度。测量后，将其反转。当对象被visible: hidden 隐藏时，它们仍然会影响页面布局 - 请注意这一点。
为避免标签与布局混淆，您可以将位置设置为绝对位置，将其移动到body标签然后测量。
【讨论】：
.hide。我将 CSS 从“显示：无”更改为“可见性：隐藏”，然后我可以使用 .width() 读取相同的值。极好的。现在，我要做的就是将所有 .hide() 摘录更改为您建议的 .css('visible', 'hidden')。我怀疑我还需要将 .show() 更改为 .css('visibility', 'visible')。谢谢。
visible: hidden 然后.show() 然后测量宽度。测量后，将其反转。那你就不用做这么大的改变了。当对象被visible: hidden 隐藏时，它们仍然会影响页面 - 请注意这一点。
您可以使用正则表达式删除非数字，然后将其转换为数字。无论您如何定义宽度（px、em、%、pt），这都有效。也保留小数点。
原版 javascript
Number(elem.style.width.replace(/[^\d\.\-]/g, ''));
jQuery
Number($elem.css('width').replace(/[^\d\.\-]/g, ''));
【讨论】：
在纯 JavaScript 中：
parseInt('100px', 10)
适用于“100em”、“100%”，甚至适用于：“100”。不需要任何正则表达式模式。
【讨论】：