iOS加载本地HTML注意点：
因为前端JS CSS 的调用有严格的页面结构 所以我们导入文件的时候尽量选择create folder reference！！！！
感谢以下这位指点迷津：
http://www.jianshu.com/p/ee417ad66ad4
加载html方式：
1.第一种方式,使用loadRequest:方法加载本地文件NSURLRequest
NSString* path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSURL* url = [NSURL fileURLWithPath:path];
NSURLRequest* request = [NSURLRequest requestWithURL:url] ;
[webView loadRequest:request];
2.第二种方式,使用loadHTMLString:baseURL:加载HTML字符串
NSURL *baseURL = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
NSString *path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
NSString *html = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
[webView loadHTMLString:html baseURL:baseURL];
3、第三种方法：
NSString *path = [[NSBundle mainBundle] pathForResource:@"test_map.html" ofType:nil];
NSURLRequest *request = [[NSURLRequest alloc] initWithURL:[NSURL fileURLWithPath:path]];
[self.webView loadRequest:request];
补充交互：
1、早期的JS与原生交互:
/**
* 获取js交互事件
* js事件里面加载了一个URL，在这个webView的代理方法中可以监听
*/
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
NSURL * url = [request URL];
if ([[url scheme] isEqualToString:@"firstclick"]) { // js里面之行的函数名（带有大写的也接收到小写）
// 对html传过来的参数做解析使用
NSArray *params =[url.query componentsSeparatedByString:@"&"];
NSMutableDictionary *tempDic = [NSMutableDictionary dictionary];
for (NSString *paramStr in params) {
NSArray *dicArray = [paramStr componentsSeparatedByString:@"="];
if (dicArray.count > 1) {
NSString *decodeValue = [dicArray[1] stringByRemovingPercentEncoding];
[tempDic setObject:decodeValue forKey:dicArray[0]];
}
}
UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:@"方式一" message:@"这是OC原生的弹出窗" delegate:self cancelButtonTitle:@"收到" otherButtonTitles:nil];
[alertView show];
}
return YES;
}
2、iOS 7之后，apple添加了一个新的库JavaScriptCore，用来做JS交互：
// iOS 7之后 js与oc交互
- (void)webViewDidFinishLoad:(UIWebView *)webView {
// 在OC中获取JS的上下文
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//定义好JS要调用的方法, share就是调用的share方法名
context[@"share"] = ^() {
// 监听到js动作 弹出oc提示框
UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:@"方式二" message:@"这是OC原生的弹出窗" delegate:self cancelButtonTitle:@"收到" otherButtonTitles:nil];
[alertView show];
// 当前调用该方法的对象
NSLog(@"对象---> %@", [JSContext currentThis]);
// JSContext提供了类方法来获取参数列表
NSArray *args = [JSContext currentArguments];
for (JSValue *jsVal in args) {
// 获取参数字符串
NSLog(@"jsVal.toString----> :%@", jsVal.toString);
}
};
}
3、 OC调用JS篇 (html在页面上加载完成之后有效)
- (void)webViewDidFinishLoad:(UIWebView *)webView {
//方式一
/** 注意：该方法会同步返回一个字符串，因此是一个同步方法，可能会阻塞UI */
// js函数名字showAlert(massage)
NSString *jsStr = [NSString stringWithFormat:@"showAlert('%@')",@"这里是JS中alert弹出的message"];
[self.webView stringByEvaluatingJavaScriptFromString:jsStr];
//方式二
/** 使用JavaScriptCore框架实现oc调用js */
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
NSString *textJS = @"showAlert('这里是JS中alert弹出的message')";
[context evaluateScript:textJS];
}
4、使用第三方进行交互：
常用的第三方如：
JSBridge
WebViewJavascriptBridge