如何在 jQuery 中获取隐藏元素的宽度？

在开发过程中，经常会碰到需要获取隐藏元素的宽度的场景，但是由于元素处于隐藏状态，无法直接通过 .width() 或 .outerWidth() 方法来获取元素的宽度。那么如何在 jQuery 中获取隐藏元素的宽度呢？下面给出两种方法：

方法一：使用 .clone() 方法

通过 .clone() 方法可以复制一个元素的所有属性，包括宽度。所以可以先将隐藏元素克隆到页面上，获取宽度后再将其移除。

var $clone = $('#hidden-element').clone().appendTo('body');
var width = $clone.width();
$clone.remove();
console.log(width);

方法二：使用 .css() 方法

通过设置元素的 visibility 属性为 hidden，元素不可见，但还是会占据页面上原来的位置，然后通过 .css() 方法获取元素的宽度。

var $hiddenElement = $('#hidden-element');
var width = $hiddenElement.css({ visibility: 'hidden' }).width();
$hiddenElement.css({ visibility: '' });
console.log(width);

需要注意的是，在获取完宽度后，需要将元素的 visibility 属性设置为 ''，使其恢复原来的状态。

以上就是在 jQuery 中获取隐藏元素宽度的两种方法，可以根据具体情况选择合适的方法。

返回markdown格式

# 如何在 jQuery 中获取隐藏元素的宽度？

在开发过程中，经常会碰到需要获取隐藏元素的宽度的场景，但是由于元素处于隐藏状态，无法直接通过 `.width()` 或 `.outerWidth()` 方法来获取元素的宽度。那么如何在 jQuery 中获取隐藏元素的宽度呢？下面给出两种方法：

## 方法一：使用 `.clone()` 方法

通过 `.clone()` 方法可以复制一个元素的所有属性，包括宽度。所以可以先将隐藏元素克隆到页面上，获取宽度后再将其移除。

```javascript
var $clone = $('#hidden-element').clone().appendTo('body');
var width = $clone.width();
$clone.remove();
console.log(width);

方法二：使用 .css() 方法

通过设置元素的 visibility 属性为 hidden，元素不可见，但还是会占据页面上原来的位置，然后通过 .css() 方法获取元素的宽度。

var $hiddenElement = $('#hidden-element');
var width = $hiddenElement.css({ visibility: 'hidden' }).width();
$hiddenElement.css({ visibility: '' });
console.log(width);

需要注意的是，在获取完宽度后，需要将元素的 visibility 属性设置为 ''，使其恢复原来的状态。

以上就是在 jQuery 中获取隐藏元素宽度的两种方法，可以根据具体情况选择合适的方法。