Hybrid----UIWebView的HTML页面

最新推荐文章于 2023-08-03 11:50:20 发布

原创最新推荐文章于 2023-08-03 11:50:20 发布 · 3.6k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#iOS #UIWebView #HTML #框架

IOS开发同时被 2 个专栏收录

75 篇文章

订阅专栏

Hybrid应用

6 篇文章

订阅专栏

在Hybrid框架的项目中，UIWebView常用于展示HTML内容。文章讨论了如何处理UIWebView的宽度，特别是当HTML页面设置width为device-width时，确保在iPad等设备上不小于768px，以实现良好的适配效果。

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

最近在做一些hybird框架的项目，对于embed的UIWebView，其宽度一般由Native app 指定，对于HTML页面

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

其中若是width指定为device-width，那么embed的UIWebView的宽不应设置小于device-width的值，如ipad的宽为768

在webView中查看HTML页面源代码

- (void)webViewDidFinishLoad:(UIWebView *)webView_ {
    NSString *jsToGetHTMLSource = @"document.getElementsByTagName('html')[0].innerHTML";
    NSString *HTMLSource = [webView_ stringByEvaluatingJavaScriptFromString:jsToGetHTMLSource];
    NSLog(@"%@",HTMLSource);
}

在webView中调整HTML页面宽度

- (void)adjustPageWidth:(UIWebView *)webView_ {

    NSString *widthStr = [NSString stringWithFormat:@"%f",webView_.frame.size.width];
    NSString * strJS = [NSString stringWithFormat:@"function adjustPageWidth(){var metas = document.getElementsByTagName(\"meta\");var strMeta=new String();var strTemp;for(var i=0;i < metas.length;i++){if(metas[i].name == \"viewport\"){metas[i].setAttribute('content',\"width=%@, initial-scale=1.0, maximum-scale=1.0, user-scalable=no\");console.log(metas[i].name);}}}",widthStr];
    [webView_ stringByEvaluatingJavaScriptFromString:strJS];
    NSString * strFunctionJS= @"adjustPageWidth();";
    [webView_ stringByEvaluatingJavaScriptFromString:strFunctionJS];

}

在webViewDidFinishLoad中调用调整页面宽度函数

- (void)webViewDidFinishLoad:(UIWebView *)webView_ {
    DebugLog(@"%@",NSStringFromSelector(_cmd));
 
        [self adjustPageWidth:webView_];
}