如何获取webView真实的高度

iOS日常开发过程中经常遇到web嵌套到tableview的场景,这时候webView的高度计算显得很重要。

日常使用姿势如下在webViewDidFinishLoad:方法中,通过JS注入方法获取web的高度:

NSString * clientheight_str = [webView stringByEvaluatingJavaScriptFromString: @"document.body.offsetHeight;"];
float height = [clientheight_str floatValue];

细心的同学可能会发现,使用如上方法计算高度时,有时候会出现网页显示不全的现象,也就是计算实际高度不对。

学过h5的同学都知道,上述的高度取的是网页<body><body>(网页内容)的高度,但并不是实际在webView中渲染出来之后的高度,所以要获取实际真实高度需要多一步操作,如下:

//获取页面高度(像素)
    NSString * clientheight_str = [webView stringByEvaluatingJavaScriptFromString: @"document.body.offsetHeight;"];
    float clientheight = [clientheight_str floatValue];
 //设置到WebView上
    webView.frame = CGRectMake(0, 0, ScreenWidth, clientheight);
//获取WebView最佳尺寸(点)
    CGSize frame = [webView sizeThatFits:webView.frame.size];
//获取内容实际高度(像素)
    NSString * height_str= [webView stringByEvaluatingJavaScriptFromString: @"document.body.offsetHeight;"];
    float height = [height_str floatValue];
//    //内容实际高度(像素)* 点和像素的比
    height = height * frame.height / clientheight;

第一次获取高度并不是真正下是之后的高度,第二次获取的height_str才是真正webView实际显示之后的高度,代码的第三行设置webView的frame非常重要,相当于对内容的一次渲染,之后去获取才是webView显示之后的真正高度。调试断点截图如下:

xcode控制台.png

可以看到两次获取body的高度不一致,第二次为实际渲染后webView的内容高度

webView实际使用中,高度计算可能受到body设置的padding和margin有关参数的影响,情况具体分析。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容