//uiwebview加载网络页面（使用UIWebView可以加载pdf文件） UIWebView *webView=[[UIWebView alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; //自动对页面进行缩放 webView.scalesPageToFit=YES; //加载页面内容，也可以加载本地文件loginAlipay.html NSURL *url=[NSURL URLWithString:@"http://baidu.com"]; NSURLRequest *request=[NSURLRequest requestWithURL:url]; [webView loadRequest:request]; [self.view addSubview:webView];
//uiwebview加载本地html UIWebView *webView=[[UIWebView alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; //自动对页面进行缩放 webView.scalesPageToFit=YES; //加载页面内容，也可以加载本地文件loginAlipay.html NSString *path=[[NSBundle mainBundle] pathForResource:@"loginAlipay"ofType:@"html"]; NSURL *url=[NSURL fileURLWithPath:path]; NSURLRequest *request=[NSURLRequest requestWithURL:url]; [webView loadRequest:request]; [self.view addSubview:webView];
//1.web视图指示加载内容时通知。应该返回YES开始加载。导航提供的类型参数，是指请求的来源，可以是下列任何一个： //UIWebViewNavigationTypeLinkClicked 用户触击了一个链接 //UIWebViewNavigationTypeFormSubmitted 用户提交了一个表单 //UIWebViewNavigationTypeBackForward 用户触击前进或返回按钮 //UIWebViewNavigationTypeReload 用户触击重新加载的按钮 //UIWebViewNavigationTypeFormResubmitted 用户重复提交表单 //UIWebViewNavigationTypeOther 发生其它行为 -(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType：(UIWebViewNavigationType)navigationType; //2.开始加载的时候执行该方法。 - (void)webViewDidStartLoad:(UIWebView *)webView; //3.加载完成的时候执行该方法。 - (void)webViewDidFinishLoad:(UIWebView *)webView; //4.加载出错的时候执行该方法。 - (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error;
//html文件
<html xmlns=http://www.w3.org/1999/xhtml> <head> <meta http-equiv=Content-Type content="text/html;charset=utf-8"> <title>IOS调用JS测试</title> <script language="javascript"> //提供给iOS调用的JS方法 function check(str){ return str+"，经过JS返回值"; } //JS调用iOS方法 function CallIos(){ //JS调用oc,UIWebView //location.href = "/CallIos/test"; window.location = "/CallIos/test"; } </script> </head> <input style="30%;height:20%;margin-left:35%;margin-top:30%" type="button" value="进行IOS调用JS测试" onclick="CallIos()"/> </html>
//CallJSViewController.m文件
#import "CallJSViewController.h" @interface CallJSViewController () @property (strong,nonatomic) UIWebView *webView; @end @implementation CallJSViewController - (void)viewDidLoad { [super viewDidLoad]; _webView=[[UIWebView alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; _webView.scalesPageToFit=YES; NSString *path=[[NSBundle mainBundle] pathForResource:@"JSTest"ofType:@"html"]; NSURL *url=[NSURL fileURLWithPath:path]; NSURLRequest *request=[NSURLRequest requestWithURL:url]; [_webView loadRequest:request]; _webView.delegate=self; [self.view addSubview:_webView]; } //网页中得每一个请求都会触发 -(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType{ //获取js请求。字符串为/CallIos/test NSString *obj=request.mainDocumentURL.relativePath; if([request.mainDocumentURL.relativePath isEqualToString:@"/CallIos/test"]) { NSLog(@"why"); return NO; } return YES; } //页面加载完毕委托 -(void)webViewDidFinishLoad:(UIWebView *)webView{ //调用js方法，并接收返回值 NSString *jsStr=[self.webView stringByEvaluatingJavaScriptFromString:@"check('页面加载完毕')"]; UIAlertView *alert=[[UIAlertView alloc] initWithTitle:@"提示" message:jsStr delegate:nil cancelButtonTitle:@"OK" otherButtonTitles: nil]; [alert show]; } @end
打开模拟器（真机）的开发者模式
【设置】->【Safari】->【高级】->【Web检查器】打开
打开iphone设备中的web检查器
2. 打开Mac上Safari的开发者模式
【Safari】->【偏好设置】->【高级】->【在菜单栏中显示“开发”菜单】勾选
打开Safari中的开发者模式
3. 写一个webview并加载一个网页
#import "ViewController.h" @interfaceViewController () @property (strong, nonatomic) UIWebView *webView; @end @implementation ViewController - (void)viewDidLoad { [superviewDidLoad]; // Do any additional setup after loading the view, typically from a nib. _webView = [[UIWebViewalloc] initWithFrame:self.view.bounds]; [_webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]]]; [self.view addSubview:_webView]; } @end
4. 在模拟器（真机）中打开webview应用，并打开Safari查看网络信息
【开发】->【iOS Simulator】->【正在调试的网站】
注意：必须要webview在加载网页时，打开Safari才可以看到调试模式。
打开Safari中的调试
在弹出的调试窗口中，可以看到当前正在加载网页的各种信息，包括源码、请求头、图片、加载的资源与脚本、控制台输出等。并且它和web前端的调试方式相同，你可以直接修改网页的CSS样式，对网页布局等进行修改，而不用重新运行整个App。
5. 修改web样式
将光标选中到要修改的样式，进行修改后，可以直接在模拟器中看到修改后的效果。
直接修改webview中的样式，当然，webview的调试技巧还有很多，比如Charles工具等。
//JSTest.html文件
<html xmlns=http://www.w3.org/1999/xhtml> <head> <meta http-equiv=Content-Type content="text/html;charset=utf-8"> <title>IOS调用JS测试</title> <script language="javascript"> //提供给iOS调用的JS方法 function check(str){ return str+"，经过JS返回值"; } //JS调用iOS方法 function CallIos(){ //JS调用oc window.webkit.messageHandlers.myScript.postMessage("JS调用WKWebView"); } </script> </head> <input style="30%;height:20%;margin-left:35%;margin-top:30%" type="button" value="进行IOS调用JS测试" onclick="CallIos()"/> </html>
使用WKWebView
头文件：
#import <WebKit/WebKit.h>
协议：
WKNavigationDelegate,WKScriptMessageHandler
//WKWebView是苹果在 iOS 8 中引入的新组件，目的是给出一个新的高性能的 Web View 解决方案，摆脱过去 UIWebView 的老旧笨重特别是内存占用量巨大的问题。WKWebView使用Nitro JavaScript引擎，这意味着所有第三方浏览器运行JavaScript将会跟safari一样快。 @property(nonatomic,strong) WKWebView *webView; //WKUserContentController对象提供了一个JavaScript来发布信息和用户脚本注入web视图 @property(nonatomic,strong) WKUserContentController *userContentController;
//js调用app的方法在WKWebView分为三步(具体分为app注册handler，app处理handler，js调用) //app注册handler WKWebViewConfiguration * Configuration = [[WKWebViewConfiguration alloc]init]; //添加js和wkwebview的调用 _userContentController =[[WKUserContentController alloc]init]; [_userContentController addScriptMessageHandler:self name:@"myScript"];//注册一个name为myScript的js方法 Configuration.userContentController = _userContentController; _webView=[[WKWebView alloc] initWithFrame:[[UIScreen mainScreen] bounds] configuration:Configuration]; NSString *path=[[NSBundle mainBundle] pathForResource:@"JSTest" ofType:@"html"]; NSURL *url=[NSURL fileURLWithPath:path]; NSURLRequest *request=[NSURLRequest requestWithURL:url]; _webView.navigationDelegate=self; //加载html页面 [_webView loadRequest:request]; [self.view addSubview:_webView];
#pragma mark -加载的状态回调 // 页面开始加载时调用 -(void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation{ NSLog(@"页面开始加载"); } // 当内容开始返回时调用 -(void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation{ NSLog(@"页面内容开始返回"); } // 页面加载完成之后调用 -(void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{ NSLog(@"页面加载完成"); //调用js方法接收返回值 [_webView evaluateJavaScript:@"check('页面加载完毕')" completionHandler:^(id _Nullable script, NSError * _Nullable error) { UIAlertView *alert=[[UIAlertView alloc] initWithTitle:@"提示" message:script delegate:nil cancelButtonTitle:@"OK" otherButtonTitles: nil]; [alert show]; }]; } // 页面加载失败时调用 -(void)webView:(WKWebView *)webView didFailNavigation:(WKNavigation *)navigation withError:(NSError *)error{ NSLog(@"页面加载失败"); } #pragma mark -页面跳转的代理方法 // 接收到服务器跳转请求之后调用 - (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(WKNavigation *)navigation{ NSLog(@"接收到服务器跳转请求"); } // 在收到响应后，决定是否跳转 - (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler{ NSLog(@"收到响应决定是否跳转"); WKNavigationResponsePolicy actionPolicy = WKNavigationResponsePolicyAllow; //这句是必须加上的，不然会异常 decisionHandler(actionPolicy); } // 在发送请求之前，决定是否跳转 - (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{ NSLog(@"发送请求之前，决定是否跳转"); //这句是必须加上的，不然会异常 WKNavigationActionPolicy actionPolicy = WKNavigationActionPolicyAllow; decisionHandler(actionPolicy); } #pragma mark 设置wkwebview的WKScriptMessageHandler代理方法处理handler委托,js请求 -(void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{ if ([message.name isEqualToString:@"myScript"]) { UIAlertView *alert=[[UIAlertView alloc] initWithTitle:@"提示" message:message.body delegate:nil cancelButtonTitle:@"OK" otherButtonTitles: nil]; [alert show]; } } -(void)dealloc{ //关闭web页面时会释放内存 [_userContentController removeScriptMessageHandlerForName:@"myScript"]; } @end