iOS【终极方案】精准获取webView内容高度，自适应高度

关于WebView内容高度的获取，相信很多人都踩过坑，无法获取到准确高度，导致页面布局出现差错，搜到的资料很多但都无法解决问题，以下是个人经验总结：

项目需求实现H5文章&原生评论效果，文章是加载H5链接，评论信息是后台接口提供，以列表形式展示。

实现思路：

1. webView加载H5链接，设置它为tableView的 headerView，下方评论信息用Cell加载展示。

2. 在webView的回调方法webViewDidFinishLoad中获取网页内容高度，设置为webView的高度，重新将webView赋给tableView的headerView。

Tip: 将一个View赋值给UITableView的tableHeaderView时，不需要手动设置高度，HeaderView会自动使用View的高度。

像上面这样，类似的方法很多，无论是JS获取，还是contentSize获取，最后结果都难以获取到准确高度，并非方法不行，而是：

webViewDidFinishLoad代理方法被调用时，页面并不一定完全展现完成，可能有图片还未加载出来，导致此时获取的高度是并不是最终高度，过会儿图片加载出来后，浏览器会重新排版，而我们在这之前给了一个错误高度，导致显示异常。

问题原因已确定，解决思考：

如何能在webViewDidFinishLoad之后获取到网页内容高度的变化？

答案：监听！

具体实现过程：

给webView的scrollView的contentSize属性添加监听，每当内容发生变化，contentSize一定会跟着变，捕获这个变动，在监听方法中实现webViewDidFinishLoad中的代码，也就是获取最新的内容高度赋给webView：

另外，在cell中使用webView获取高度不准确的解决办法跟上面一样，只不过需要注意cell中使用webView涉及到cell重用，会导致滑动列表时webView多次加载，影响性能，建议缓存高度。

注意：

如果不走监听，要先怀疑自己，不要怀疑我！

1. 确保webview已经加在页面上了，并且能够正常显示，然后再继续获取内容高度，如果都显示不了，别来找我！

2. 是给webview的scrollview添加监听，不要加在webview上，否则累死你也不会走监听方法！

3. 如果你用的是swift，那请先看这篇文章：Swift中KVO（监听）的使用方法及注意事项

若上述方式解决不了你的问题，请尝试另一方案： iOS 【奇巧淫技】获取webView内容高度

以上属于臭码农原创，若有雷同属巧合，如有错误望指正，转载请标明来源和作者。by：臭码农

转载于:https://juejin.im/post/5a323ebb51882507ae260632

iOS【终极方案】精准获取webView内容高度，自适应高度相关推荐

iOS开发精准获取webView内容高度
监听!!!! 给webView的scrollView的contentSize属性添加监听,每当内容发生变化,contentSize一定会跟着变,捕获这个变动,在监听方法中实现webViewDidFin ...
iOS 【奇巧淫技】获取webView内容高度
针对获取webView高度问题之前写过一个方案--通过监听WebView的scrollView的变化来实时更新高度附上链接: iOS[终极方案]精准获取webView内容高度,自适应高度本文是给出 ...
js实现textarea根据内容大小自适应高度
首先,我们来看看源代码: /** * 文本框根据输入内容自适应高度 * @param {HTMLElement} 输入框元素 * @param {Number} 设置光标与输入框保持的距离(默认0) ...
【转】 Android WebView内容宽度自适应
我们平常在项目中有可能会遇到网页的内容是通过json数据传递到app上面用WebView来显示的,这时候我们通常都要调整内容的总宽度不超过父容器的宽度,这样子用户可以不用左右滑动就可以看到全部的内容. ...
动态获取并设置 iframe 自适应高度
实际需求:页面中有一些固定元素 + 内嵌 iframe 页面,此时如果给 iframe 设置固定高度会导致 iframe 内部滚动,体验不佳. 于是需要动态获取 iframe 实际高度并设置,但有些 ...
iOS 获取WKWebView内容高度做H5原生连接
前言:是这样的,刚写完上一篇文章还没缓过神来,上一篇文章我还提到了,想和大家聊聊原生+H5如何无缝连接的故事.结果我朋友就给我发了两篇他的作品.他的做法也都有独到之处.好的文章都是这样,让你每次看都能 ...
IOS UITextView自适应高度
LOFTER app需要实现了一个类似iPhone短信输入框的功能,它的功能其实蛮简单,就是:[UITextView的高度随着内容高度的变化而变化].实现思路应该是: 在UITextView的text ...
Iframe用法的详细讲解(属性、透明、自适应高度)和html中滚动条属性设置
Iframe 用法的详细讲解(属性.透明.自适应高度)和html中滚动条属性设置 scrollbar属性.样式详解 1． overflow内容溢出时的设置(设定被设定对象是否显示滚动条) overfl ...
解决子级用css float浮动而父级div没高度不能自适应高度
当在对象内的盒子使用了float后,导致对象本身不能被撑开自适应高度,这个是由于浮动产生原因. 方法一:对父级设置固定高度此方法可用于能确定父级div内子级对象高度. 缺点: 父级是固定高度,而不随 ...