wkwebview 通过scrollHeight 获取的实际高度不准确

最新推荐文章于 2023-07-26 16:30:59 发布

原创

最新推荐文章于 2023-07-26 16:30:59 发布 · 8.7k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#webview

本文讨论了在移动端使用WKWebView加载富文本时，因内容未按屏幕设备缩放导致滚动高度不准确的问题。文章通过示例代码展示了如何通过添加meta标签和处理img元素来确保高度正确适应移动端。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需求

移动端使用webview加载后端返回的富文本，当在移动端点击查看全部的时候，全部显示。

示例

这里写图片描述

示例代码


    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {

      webView.evaluateJavaScript("document.body.scrollHeight") { (value, error) in

     LLog(value);
     self.currentHeight = CGFloat(value

最低0.47元/天解锁文章

200万优质内容无限畅学

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Micah_A

关注关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

获取 WKWebView 高度

优快云博客

01-09

1038

1、这种方法只能在网页加载完成后调用一次，如果网页中有图片异步加载出来，则不会调用。 //页面加载完成之后调用 - (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation { // document.body.scrollHeight（加载HTML源站用这个） document.body.offsetHeight;(加载HTML字符串) [webView eval

vue3中onMounted获取元素高度不准确

DN金猿的博客

07-26

830

设个定时器，在页面挂载完1秒后再获取高度，就获取到实际高度了，但是有一点，页面体验感不是很好，而且偶尔也会出现获取值不准确现象。如果你有更好的解决方案，可以在下方评论区留言。以上数据可以通过打印ref实例和ref.value.offersetHeight查看。页面元素和页面资源未完全渲染与加载完，就获取高度，导致获取不准确。

参与评论您还未登录，请先登录后发表或查看评论

ios-获取WKWebView加载完成之后的高度.zip

07-11

获取WKWebView的高度，注意在控制器销毁后，为防止内存泄漏，需要将WKUserContentController *userCC = self.wkConfig.userContentController; //JS调用OC 添加处理脚本 [userCC addScriptMessageHandler:self name:@"jsCallOC"]; 的代理置位空

WKWebView高度获取不准解决办法

码农天后的博客

01-18

1125

一般APP会在详情页下面原生拼接例如：评论或展示的Cell 很多人遇到WKWebView高度获取不准确，例如：下面一片空白，高度一直在增加，上拉刷不动，各种问题。获取高度一般用kvo或者js，我是使用kvo监听。获取不到高度，换下URL，百度什么的试试，先排除下。我的做法，代码是没问题的，试了几个URL，也正常加载出来，只有公司URL有问题，与H5讨论下，问题描述完告诉我，高度塌陷。 H5这边只改了几句代码，我再测试，完美加载。贴下H5改的代码此图的高度是正确的页面查看的高度，不

iframe自适应高度 document.body.scrollHeight取值不对

CHOUFENGDDDDDD的博客

01-07

5813

springmv 切换iframe 时发现直接修改iframe src 或者使用 location.href = "“时不起作用之后才有form 标段提交在control中返回新网页的地址才完成了网页切换之后iframe自适应高度有出现了问题子页面中使用document.body.scrollHeight获取的高度值不对在iframe引用的前一个页面的高度比ifra...

WKWebView高度获取不准确，解决办法

weixin_39851592的博客

11-01

4739

WKWebView高度获取不准确，解决办法一般APP含有详情页，目前主流做法，上面放个WKWebView(iOS8之后)，下面原声拼接(评论或展示的Cell). 很多人遇到WKWebView高度获取不准确，例如问题：下面一片空白，高度一直在增加，上拉刷不动，各种问题。获取高度一般用kvo或者js,我是使用kvo监听. 获取不到高度，换下URL，百度什么的试试,先排除下。我的做法，代码是没问题...

webview document.body.scrollHeight 获取的高度不准确

XiaoZhuang__的博客

05-28

1370

解决方案 1、给富文本加上meta标签适配移动端 <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"> 2、我们对img进行处理 <style type="text/css"> img{ display: inline-block; max-width: 100%; } </style&gt

解决vue项目获取dom元素宽高总是不准确问题

10-15

然而，在实际操作中，可能会遇到获取的宽高不准确的问题，特别是在数据动态更新后。这个问题通常源于DOM元素尚未完成渲染，导致获取的尺寸信息不正确。在描述中提到，当重置数据后直接通过`this.$refs.editor[0]....

ios-计算WKWebview的实际高度.zip

07-11

标题中的“ios-计算WKWebview的实际高度.zip”提供了一个解决方案，通过观察者模式来动态计算WKWebView的高度，以避免出现高度计算不准确的问题。 WKWebView的默认行为是其高度会自适应内容，但有时由于网络延迟、...

页面滚动组件scroll不能正确获取高度的问题如何解决

abc942857321的博客

11-26

1560

图一：图二：图二源码的页面显示为图一，在这里有一个获取到数据后，scroll有时滚动高度不正确的问题。在这个滚动中有两部分内容，第一部分是slider焦点图区域，第二部分是热门歌单推荐列表部分，这两部分的数据内容分别从两个接口中获取，因为网络速度的原因，所以接口获取数据的速度不一致，而且先后也存在不确定性，如果第一部分的数据先获取，页面先渲染，那么页面高度不会存在什么问题...

JS获取scrollHeight问题想到的标准问题

10-30

如果没有文档声明可以用 document.body.scrollHeight,如果有文档声明必须用 document.documentElement.scrollHeight关于这方面的东西

iOS11 WKWebview获取高度不准确问题

zhaotao0617的博客

10-18

5072

遇见这个问题的时候，我发现偏离了大概64像素，由此联想到了tableView和collectionView。故解决办法如下： if (@available(iOS 11.0, *)) { _webView.scrollView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNe

html5 scrollheight,scrollHeight和scrollWidth，获取网页内容高度和宽度不正确

weixin_42300121的博客

06-19

768

问题如下图所示，高度明显不正确，请问问题出在哪，希望能给出详细解释。另外，希望能再具体解释下document.documentElement.clientHeight、window.innerHeight、document.documentElement.scrollHeight及document.body.clientHeight之间的关系，发现document.body.clientHeigh...

关于webVIew高度变化

qq_28498205的博客

12-06

596

// 注册观察者 [_wkWebView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionNew context:nil]; // 监测高度变化 - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:...

WKWebView遇上UIScrollView，动态获取WKWebView的高度

欢迎来到Jack的程序世界

11-20

7334

开发过程中经常会碰到这样的需求，顶部是自定义的UIView,下面是使用webView,然后实现一起滚动。需求如下图：实现思路也简单，可以使用UIScrollView为父视图，自定义view和webView作为子视图，或者使用UITableView,自定义view作为tableHeaderView，webView添加到 UITableViewCell上。关键是如何获取高度。这里通过

解决在Firefox(<21)下获取 scroll[Width|Height] 值不正确的bug

weixin_33709219的博客

06-13

401

为什么80%的码农都做不了架构师？>>> ...

iOS WKWebView获取h5页面的实际高度

xiaoxiaobaibaicai的博客

11-27

2763

#pragma mark - observer - (void)addWebViewObserver { [self.wkWebView.scrollView addObserver:self forKeyPath:@"contentSize" options:NSKeyValueObservingOptionNew context:nil]; } - (void)removeWeb...

uniapp微信小程序scroll-view滚动scrollLeft不准确

T3165919332的博客

07-26

2856

但是这种方法会影响性能，这是因为关闭节流后,onScroll 事件会在每次滚动时触发,可以提高滚动位置监测的精确度。但需要注意的是,这会增加一定的性能消耗,如果滚动区域很大,滚动频繁,会带来较大的计算压力。所以在复杂场景下,我们还是建议保留系统的节流行为。原因：因为每次滚动监听事件都会被调用比较耗费资源系统会默认节流，可以在scroll-view 加一个。今天在实现微信小程序的一个横向导航的时候出现了一个问题，就是每次滑到滚动条最右边的时候。如果不想消耗过多性能,又想实现精确的滚动监听，怎么办？

js -- 获取浏览器高度以及clientHeight、scrollHeight、offsetHeight区别

bobobocai的博客

11-22

9043

//浏览器卷去部分高度 var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; //浏览器窗口高度，已做兼容 var winHeight; if (window.innerHeight) { winHeight = window.innerHeig

iframe中的html获取元素的scrollHeight不准确问题