iOS中关于HTML的常用技术
OC&&JS交互
- OC调用JS
OC可以直接通过webview
的- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;
方法直接调用JS的方法
例如JS中已经实现的方法:
<script type="text/javascript">
//JS方法-----------------------------------------------------------------------
function loginSucceed(){//JS方法-登录成功提示
alert("登录成功");
}
function showAgreement(str){//JS方法-查看用户协议
alert(str);
}
function loginButtonClick(){//JS方法-登录按钮点击
window.location.href = "login";
}
</script>
那么在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";
<!--a标签 href-->
<a href="gotoNextVC">跳转到下一个控制器</a>
<!-- 带参数 -->
//JS中window.location的href
window.location.href = "login?name=zhangsan&password=123456";
//在HTML中的a标签
<a href="login?name=zhangsan&password=123456">登录</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交互的库
<JavaScriptCore/JavaScriptCore.h>
主要使用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];
}
}
}