iOS-UIWebView加载HTMLString图片显示超过屏

作者: abcdef沧海 | 来源:发表于2017-02-08 11:42 被阅读1420次

iOS-UIWebView加载HTMLString图片显示超过屏
iOS-UIWebView加载HTMLString图片显示超过屏
解决WKWebView不显示H5中引用的Library本地图片问
Flutter 图片无法缓存
图片响应式（数据绑定在标签上）
加载HTMLString
2018-11-07
<img> 的 title 和 alt 属性的区别
FlatList显示图片列表
Android大尺寸图片加载问题

使用[self.webView loadHTMLString:htmls baseURL:nil]单纯加载HTMLString的小技巧。

主要解决的是当加载的HTMLString既有文字又有图片时，图片没有缩放，导致图片宽度超过屏幕宽度，使得webView整体左右都可以滑动

/**
* str就是后台返回的富文本string
* " $img[p].style.width = '100%%';\n"--->就是设置图片的宽度的
* 100%代表正好为屏幕的宽度
*/

NSString *htmlString = [NSString stringWithFormat:@"<html> \n"
                        "<head> \n"
                        "<style type=\"text/css\"> \n"
                        "body {font-size:15px;}\n"
                        "</style> \n"
                        "</head> \n"
                        "<body>"
                        "<script type='text/javascript'>"
                        "window.onload = function(){\n"
                        "var $img = document.getElementsByTagName('img');\n"
                        "for(var p in  $img){\n"
                        " $img[p].style.width = '100%%';\n"
                        "$img[p].style.height ='auto'\n"
                        "}\n"
                        "}"
                        "</script>%@"
                        "</body>"
                        "</html>",str];

[self.webView loadHTMLString:htmlString baseURL:nil];

[self.view addSubview:_webView];

}

屏幕快照 .png