话说,前几天的一个上午,正美滋儿的敲着代码呢,Slack上突然蹦出来个消息,说我们有一个网页布局乱掉了。
掏出手机看了下好像并没有什么问题,Xcode build了一个线上的版本模拟器看了下也是正常的,感觉像是虚惊一场。正巧昨晚发布了iOS 10.3,于是就开始吭哧吭哧的升级手机和Xcode。升级完之后再打开那个出问题的页面发现布局还真是乱掉了。但是不确定之前看正常是因为网络缓存还是没有升级10.3。
怎么乱掉的呢?document.ready的时候我做了一些布局的工作,但实际上这个时候元素还没有被正常的layout,于是这里面拿到的全都是错误的宽高。
修起来很简单,两个办法。
一个是setTimeOut,等着layout差不多完成的时候再去布局
另一个是window.onLoad,这个方法会在所有资源都加载完毕之后才会被调用
后来测下来发现果然只有10.3的WKWebView会出现这个问题。