JavaFX WebView宽度变更时调整高度，拉宽后document.body高度不下降问题

问题根因 #

拉宽WebView后高度不回落的核心原因是：缩窄宽度时你已经把WebView固定为了较大的高度值，HTML文档的父容器高度被撑大后，就算宽度增加、文本行数减少，body和html的高度也会继承父容器的固定高度，不会自动收缩回实际内容的高度。

可行修复方案 #

1 修改高度计算逻辑 #

在执行JS计算高度之前，先临时把WebView的高度重置为极小值，触发HTML文档重新计算当前宽度下的实际内容高度，再读取正确值回设即可。
调整后的setWebViewHeight方法代码如下：

// sets the height of the webview based on the height of its content
// only if all webviews have finished loading their contents, very important
public void setWebViewHeight(WebView webView) {
    
    if (viewsLoaded < viewsToLoad) {
        return;
    }
    
    WebEngine webEngine = webView.getEngine();
    
    // 新增：临时重置WebView高度，让HTML内容重新计算实际高度
    webView.setMinHeight(1);
    webView.setMaxHeight(1);
    webView.setPrefHeight(1);
    
    // 新增：强制body高度自适应，避免继承之前的固定高度
    String heightText = webEngine.executeScript(  
            "document.body.style.height = 'auto';" +
            "var body = document.body,"
                    + "html = document.documentElement;"
                    + "Math.max( body.scrollHeight , body.offsetHeight, "
                    + "html.clientHeight, html.scrollHeight , html.offsetHeight );"
    ).toString();
    System.out.println("heightText=" + heightText);

    double height = Double.valueOf(heightText.replace("px", "")); 

    webView.setMinHeight(height);
    webView.setMaxHeight(height);
    webView.setPrefHeight(height);
}

2 可选优化：消除HTML默认边距 #

如果计算出的高度存在多余空白，可以在加载内容时给HTML套一层基础样式，清空默认边距：

// 替换原有的webEngine.loadContent(textString);即可
String htmlContent = "<!DOCTYPE html>" +
        "<html><head>" +
        "<style>*{margin:0;padding:0;box-sizing:border-box;}</style>" +
        "</head><body>" + textString + "</body></html>";
webEngine.loadContent(htmlContent);

效果说明 #

• 缩窄宽度时逻辑和原有实现一致，高度会随文本换行自动升高
• 拉宽宽度时，临时重置高度的操作会触发HTML重新排版，读取的高度就是当前宽度下的实际内容高度，不会有多余空白也不会出现滚动条

内容的提问来源于stack exchange，提问作者Geoff L