如何使用 jQuery 取得隱藏元素的高度？-js教程-PHP中文網

如何使用 jQuery 取得隱藏元素的高度？

Barbara Streisand

發布： 2024-11-02 19:47:02

原創

1082 人瀏覽過

How to Get the Height of a Hidden Element with jQuery?

使用 jQuery 檢索隱藏元素的高度

使用隱藏元素時，可能需要出於各種目的檢索其尺寸。然而，如果元素不可見，獲取元素高度的傳統方法可能會失敗。

低效方法

所描述的暫時取消隱藏元素的方法，測量

替代解決方案

jQuery 提供了更有效率的解決方案：

修改元素屬性： 暫時操作元素的樣式屬性：
- 將位置設為絕對（如果元素已經絕對定位，則可選）
- 將visibility設定為hidden（使元素不可見）
- 將display設為block（使元素可見，但不在主文檔流中）
Measure高度： 使用jQuery 的.height() 方法檢索元素的高度。
恢復屬性： 使用 attr() 方法將元素的樣式屬性重設為其原始值或透過直接設定 style 屬性。

程式碼範例

<code class="javascript">var previousCss = $("#myDiv").attr("style");

$("#myDiv").css({
    position: 'absolute',
    visibility: 'hidden',
    display: 'block'
});

var optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");</code>

登入後複製

此方法可讓您在不影響版面的情況下謹慎測量隱藏元素的高度或頁面的可見度。

以上是如何使用 jQuery 取得隱藏元素的高度？的詳細內容。更多資訊請關注PHP中文網其他相關文章！