iOS与WKWebView交互问题——动态获取webView高度

在iOS原生界面有时会遇到需要使用或加入一部分webview模块，我们知道在加载html文本后获取webview高度可以通过以下方法

#pragma mark - KVO
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {
    if (_webView.estimatedProgress >= 1.0f) {
                dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                    CGFloat height = self.webView.scrollView.contentSize.height;
                    self.webView.height = height;
                    NSLog(@"height---%f",self.webView.scrollView.contentSize.height);
                    if (self.detailHieghtBlock) {
                        self.detailHieghtBlock(height+0.001);
                    }
                });
            }
}

来进行高度传递，但是在特定的需求下这个方式就不太够用，比如

当需要修改 webview 的字体大小的时候，需要设置更新 webview 的 frame，这时候就会遇到常见的一个问题，就是当字体 从小到大 变化的时候是正常的，当字体 从大到小 变化的时候，webview 的高度不会变化，这样就导致webview的底部一大片的空白

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    __weak typeof(self) weakSelf = self;
    [webView evaluateJavaScript:@"document.body.offsetHeight" completionHandler:^(id _Nullable m, NSError * _Nullable error) {
        CGFloat webHeight = [m floatValue];
        webView.frame = CGRectMake(15, 0, kScreenWidth-30, webHeight);
    }];
}

这时候我们可以在 body标签内部再套一层标签，如下：

然后再获取div的高度

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
    __weak typeof(self) weakSelf = self;
    [webView evaluateJavaScript:@"document.getElementById('bodybox').offsetHeight" completionHandler:^(id _Nullable m, NSError * _Nullable error) {
        CGFloat webHeight = [m floatValue];
        webView.frame = CGRectMake(0, 0, kScreenWidth, webHeight);
    }];
}

按照这个办法来做的话，就可以准确的获取到webview的高度了，无论字体从大到小还是从小到大，获取的高度都是正确的。

知识点

解决该问题之后，需要了解下面关于 html 的知识点：

1、 body标签

body 标签的高度设定好之后，如果里面内容的高度大于 body 的高度，那么 body 会被撑开，高度发生变化，反之，body 的大小不会发生改变，高度自然也就是固定的了。

2、设置字体大小

document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= 100%
复制代码

3、获取body的高度

document.body.offsetHeight