1、加載HTML字符串時(shí)，里面有圖片標(biāo)簽<img的顯示有時(shí)候過(guò)寬過(guò)高。下面這段js代碼就是取到所有圖片，給高度設(shè)置最大值。
- (void)webViewDidFinishLoad:(UIWebView *)webView{
[webView stringByEvaluatingJavaScriptFromString:
@"var script = document.createElement('script');"
"script.type = 'text/javascript';"
"script.text = \"function ResizeImages() { "
"var myimg,oldwidth;"
"var maxwidth = 360;" // UIWebView中顯示的圖片寬度
"for(i=0;i <document.images.length;i++){"
// "var httpP = \"http://webapi.houno.cn\"+imageArr[i].getAttribute(\"src\");"
// "imageArr[i].setAttribute(\"src\",httpP);" // 遇到返回圖片路徑不是全路徑的情況拼接，但沒(méi)有成功！估計(jì)是加載先后順序問(wèn)題導(dǎo)致，這個(gè)方法走的時(shí)候已經(jīng)加載完成。
"myimg = document.images[i];"
"if(myimg.width > maxwidth){"
"oldwidth = myimg.width;"
"myimg.width = maxwidth;"
"}"
"}"
"}\";"
"document.getElementsByTagName('head')[0].appendChild(script);"];
[webView stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];
}
但是這個(gè)方法把寬度設(shè)置了固定值，在不同機(jī)型上不能很好的展示！
2、還有一種不用考慮寬度問(wèn)題的方法
- (void)webViewDidFinishLoad:(UIWebView *)webView{
NSString *js = @"function imgAutoFit() { \
var imgs = document.getElementsByTagName('img'); \ // 取到所有圖片
for (var i = 0; i < imgs.length; ++i) {\
var img = imgs[i]; \
img.style.maxWidth = %f; \
img.style.maxHeight = %f; \
} \
}";
js = [NSString stringWithFormat:js, [UIScreen mainScreen].bounds.size.width - 20,200]; // 設(shè)置寬高，高度可以不設(shè)置
[webView stringByEvaluatingJavaScriptFromString:js];
[webView stringByEvaluatingJavaScriptFromString:@"imgAutoFit()"];
}
以上這兩種方法都有一個(gè)問(wèn)題，當(dāng)HTML標(biāo)簽中的圖片有自帶的Style標(biāo)簽（包括寬高的相關(guān)設(shè)置）時(shí)，加載HTML還是按照自己的style，所有還是存在過(guò)高、過(guò)寬的問(wèn)題。
3、為了解決HTML中圖片自帶寬高屬性問(wèn)題，所以要在加載HTML字符串之前對(duì)字符串進(jìn)行處理。
拼接圖片地址成功版本：
NSString *htmls = [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"
"var httpP = \"http://webapi.houno.cn\"+$img[p].getAttribute(\"src\");"
"$img[p].setAttribute(\"src\",httpP);" // 這里發(fā)現(xiàn)拼接圖片地址也能成功了。
"$img[p].style.width = '100%%';\n"
"$img[p].style.height ='auto'\n"
"}\n"
"}"
"</script>%@"
"</body>"
"</html>",webInfo]; // 這里的webInfo就是原始的HTML字符串。
[self.myWebView loadHTMLString:htmls baseURL:nil];
DLog(@"webInfo后:%@",htmls);
目前為止我遇到的問(wèn)題基本解決了。
相關(guān)參考：只記得這一個(gè)啦！
http://blog.csdn.net/wenmingzheng/article/details/50493658?utm_source=itdadao&utm_medium=referral
