小的作为一个iOS程序猿,可能研究JavaScript以及H5相关的知识并不是为了真正的要去转行做这一方面,其实更多的为了要研究OC中的JavaScriptCore框架,JavaScriptCore框架主要是用来实现iOS与H5的交互.当然了,最早我曾经写过iOS浅谈webView的JS一种用法.(去掉web显示页的广告),这种算得上最简单的iOS与H5的交互了.现在混合编程越来越多,H5的相对讲多,所以研究JavaScriptCore框架是相当有必要的.好了不扯这些没用的了,来搞今天的主题---JavaScriptCore框架,首先来说说JavaScriptCore框架几个常用的类.
在做OC与H5的交互之前,我们需要先导入JavaScriptCore框架.
#import <JavaScriptCore/JavaScriptCore.h>然后我们进入JavaScriptCore框架的JavaScriptCore.h,我们发现总共如下有几个类.
在进行iOS与H5的交互之前,我们需要做的是对JSContext对象进行初始化的设置,全程是在webView的- (void)webViewDidFinishLoad:(UIWebView *)webView这个代理方法中进行的.所以我们需要对webView进行初始化以及设置代理,这里就不过多的言语了.我们直接看一下在代理方法中如何对JSContext对象进行初始化设置.代码如下所示.
- (void)webViewDidFinishLoad:(UIWebView *)webView{ //对JSContext对象进行初始化 self.context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"]; //验证JSContext对象是否初始化成功 self.context.exceptionHandler = ^(JSContext *context, JSValue *exceptionValue) { context.exception = exceptionValue; }; }上一个模块我们已经对JSContext对象进行了初始化,那么要使用JavaScript调取OC代码主要有两种方式,一种是使用block(简单粗暴);另外一种是使用JSExport协议(决胜千里).
block方式比较简单,也是我比价推荐的一种,但是要注意防止循环引用问题的发生.首先我们先说一下不带有参数的函数调用,也就是说我们不需要从网页那边有参数的传值,比如跳转页面等等.代码如下所示. HTML文件中的<body>标签的按钮代码
<button onclick="myAction();" style="">点击按钮返回上一个页面</button>OC中在- (void)webViewDidFinishLoad:(UIWebView *)webView方法中对block块进行代码实现.
__weak typeof(self)temp = self; self.context[@"myAction"] = ^(){ [temp.navigationController popViewControllerAnimated:YES]; };接下来我们看一下,通过页面的传值,我们把H5标签的值作为参数进行传值操作,并且调用OC的block进行打印. HTML文件中的<body>标签的div标签代码(一个输入框,一个按钮)
<input type="text" name="输入框" id="textField" placeholder="请输入要打印的信息" /> <button onclick="log(document.getElementById('textField').value);">打印输入框信息</button>然后我们在OC的代码中实现以下block函数.其中string参数就是网页中输入框的值.
self.context[@"log"] = ^(NSString *string){ NSLog(@"%@",string); };效果图如下所示.坐标是手机模拟器,右边是Xcode控制台.
