前言
由于WKWebview的功能强大、UIWebview更占内存、iOS12中UIWebView的废弃等诸多原因，使得WKWebview备受欢迎，但是其中也有许多坑
坑
笔者想在WKWebview上添加个headerView，如商品详情页中富文本上面的商品信息，方法有两种，一是利用JS代码修改富文本添加相关视图，二是在WKWebview的ScrollView上设置偏移量并添加View
let headHeight = 100
webView.scrollView.addSubview(header)
webView.scrollView.contentInset = UIEdgeInsets(top: headHeight, left: 0, bottom: 0, right: 0)
但是添加完头视图之后再加载富文本，WKWebView会跳动一下（闪一下）,具体原因是网页加载的时候，scrollViewDidScroll会走两遍，第一次的ScrollView.contentOffset是不准确的
解决方法
1.WKWebView的alpha设置alpha=0，然后在网页加载结束的时候将alpha设置alpha=1
web.alpha = 0
web.backgroundColor = .white
web.navigationDelegate = self
遵守WKNavigationDelegate
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
UIView.animate(withDuration: 0.3) {
webView.alpha = 1
}
}
笔者目测淘宝现阶段的效果就是这样：点击商品详情->出现底部工具栏+白色webView+loading圈->加载完毕，出现正常webView，loading圈消失
2.控制ScrollView.contentOffset的值
既然问题出现的原因在于第一次scrollViewDidScroll时ScrollView.contentOffset不准确，那么就可以遵守UIScrollViewDelegate控制scrollViewDidScroll
//全局定义webview(富文本)高度 & 是否正在加载
var webheight: CGFloat = 0.0
var isLoading: Bool = true
web.scrollView.delegate = self
web.navigationDelegate = self
func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
// 获取内容实际高度
webView.evaluateJavaScript("document.body.scrollHeight") { [unowned self] (result, error) in
if let tempHeight: CGFloat = result as? CGFloat {
// isLoading置否，且获取webHeight
self.isLoading = false
self.webheight = tempHeight
}
}
}
func scrollViewDidScroll(_ scrollView: UIScrollView) {
guard isLoading else {
webView.scrollView.contentSize = CGSize(width: ScreenWidth, height: headHeight + webheight)
return
}
webView.scrollView.contentSize = CGSize(width: 0, height: 0)
}
加载时webView的滑动区域为0，使其不可滑动，就不会出现页面闪一下的情况；加载完之后重新设置webView的滚动区域，就能达到我们的需求了
