非附加元素宽度在 Chrome 中不起作用答案

【问题标题】：non attached element width not working in Chrome非附加元素宽度在 Chrome 中不起作用
【发布时间】：2017-03-02 13:20:39
【问题描述】：

我正在尝试在 Chrome 中找到解决方案。在 Firefox 中，我可以通过以下方式获取元素的大小（来自 CSS），而无需附加/显示它：

var elem = $('<div class="someclass"></div>');
var w = elem.width();
console.log(w);

FF 给了我正确的尺寸，但 Chrome 总是返回 0。有什么解决方法吗？

【问题讨论】：

【解决方案1】：

尝试通过 ID 或 Classname 获取选择器。 Jsfiddle

var elem = $('<div class="someclass"></div>');
var w = $(".someclass").width();
console.log(w);

它适用于所有浏览器；

【讨论】：

它在 chrome 中工作。检查 JSfiddle。在您的示例中，您没有使用 javascript 创建任何 HTML 或附加任何 HTML 代码，那么它将如何工作。
请阅读问题。我不想附加到 DOM。
对不起。那么不同的浏览器会以不同的方式呈现。

【解决方案2】：

这是某些浏览器的一些奇怪行为。

不过我找到了解决办法：

var elem = $('<div class="someclass"></div>').hide();
$('body').append(elem);
var width = elem.width();
elem.remove();
console.log(width);

【讨论】：

【解决方案3】：

所有这些解决方案都让我附加到 DOM。我想如果使用 Chrome 而不是附加，则没有解决方案。

【讨论】：