iOS中关于HTML的常用技术
OC&&JS交互
- OC调用JS
OC可以直接通过webview的- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;方法直接调用JS的方法
例如JS中已经实现的方法：
那么在OC中调用上面JS的方法如下：
//调用JS方法:登录成功提示--无参数
[webView stringByEvaluatingJavaScriptFromString:@"loginSucceed();"];
//调用JS方法:查看用户协议--带参数
NSString *ocStr = @"用户协议：OC传进去的值";
[webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"showAgreement('%@');", ocStr]];
如果有多个参数的话可以在 stringWithFormat 后面继续拼接即可
- JS调用OC
JS调用OC的话一般是用过a标签的href或者是window.location的href来调用OC的方法，传递参数的话可以用类似于GET请求的参数一样在问好后面拼接参数。
例如OC的方法如下：
//OC方法:跳转到新的控制器--不参数
- (void)gotoNextViewController{
NSLog(@"跳转到下一个控制器");
}
//OC方法:登录--带参数
- (void)loginWithUserName:(NSString *)userName password:(NSString *)password{
NSLog(@"正在登录：账号%@，密码%@", userName, password);
}
那么在JS中调用上面的方法如下：
//window.location的href
window.location.href = "gotoNextVC";
跳转到下一个控制器
//JS中window.location的href
window.location.href = "login?name=zhangsan&password=123456";
//在HTML中的a标签
登录
在OC中需要在webView将要加载的方法中作以下处理：
//webView将要加载
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
if([request.URL.scheme hasPrefix:@"login"]){//检查到是登录---带参数
//获取并解析Url中的参数
NSDictionary *dict = [self urlStrToDict:request.URL.scheme];
NSString *name = dict[@"name"];
NSString *password = dict[@"password"];
//调用OC的带参数方法
[self loginWithUserName:name password:password];
return NO;
}else if ([request.URL.scheme hasPrefix:@"gotoNextVC"]){//检查到时跳转到下个控制器---不带参数
//直接调用OC不带参数方法
[self gotoNextViewController];
}
return YES;
}
/**
解析url中的参数并转换为字典
@return 参数字典
*/
- (NSDictionary *)urlStrToDict{
if (self && self.length && [self rangeOfString:@"?"].length == 1) {
NSArray *array = [self componentsSeparatedByString:@"?"];
if (array && array.count == 2) {
NSString *paramsStr = array[1];
if (paramsStr.length) {
NSMutableDictionary *paramsDict = [NSMutableDictionary dictionary];
NSArray *paramArray = [paramsStr componentsSeparatedByString:@"&"];
for (NSString *param in paramArray) {
if (param && param.length) {
NSArray *parArr = [param componentsSeparatedByString:@"="];
if (parArr.count == 2) {
[paramsDict setObject:parArr[1] forKey:parArr[0]];
}
}
}
return paramsDict;
}else{
return nil;
}
}else{
return nil;
}
}else{
return nil;
}
}
- iOS7之后系统提供的OC与JS交互的库
JSContext对象
JSContext可以直接替换JS的方法，让JS的方法在执行的时候直接进入OC的Block回调，同时也可以直接执行JS的方法，代码如下：
//webView加载完毕
- (void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
//JS调用OC-----------showAgreement是需要替换的JS方法名称
context[@"showAgreement"] = ^() {
NSArray *args = [JSContext currentArguments];
for (JSValue *jsVal in args) {
NSLog(@"JS的的参数:%@", jsVal.toString);
}
//在这里可以做OC想做的事情
};
//OC调用JS------------方法loginSucceed()是JS的方法，参数可以用stringWithFormat的形式拼接在后面
[context evaluateScript:@"loginSucceed()"];
}
WKWebView获取标题和进度
在创建WKWebView时添加进度和标题的监听
//添加进度监听
[_webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];
//添加标题的监听
[_webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:NULL];
然后实现监听的的回调方法
//监听的回调
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {
if (object == self.webView && [keyPath isEqualToString:@"estimatedProgress"]) {//获取进度
CGFloat newprogress = [[change objectForKey:NSKeyValueChangeNewKey] doubleValue];
if (newprogress == 1) {
self.progressView.hidden = YES;
[self.progressView setProgress:0 animated:NO];
}else {
self.progressView.hidden = NO;
[self.progressView setProgress:newprogress animated:YES];
}
}else if (self.getTitle && [keyPath isEqualToString:@"title"]){//获取标题
if (object == self.webView){
self.title = self.webView.title;
}else{
[super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
}
}
}