IOS与网页JS交互
随着移动APP的快速迭代开发趋势，越来越多的APP中嵌入了html网页，但在一些大中型APP中，尤其是电商类APP，html页面已经不仅仅满足展示功能，这时html要求能与原生语言进行交互、相互传值。比如携程APP中一个热门景点的网页中，点击某个景点，可以跳转到原生中的该景点详情页控制器。
为此，我整理了三种最常用最便捷有效的OC与JS交互的方式，供大家学习交流。
第一种：JS给OC传值。
1. 技术方案：使用JavaScriptCore.framework框架
2. 使用场景： 网页中代码中的某个方法，比如点击事件方法，将该方法的参数传值给OC，供OC使用。
比如：携程APP中一个热门景点的网页中，有很多个热门景点，点击某个景点的图片或名称，可以跳转到原生中的该景点详情页控制器。
3. 代码实现如下：
OC里要实现的代码：
拖入JavaScriptCore.framework静态库，遵守UIWebViewDelegate代理协议。
在-webViewDidFinishLoad:方法里编写如下代码：
- (void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
context[@"passValue"] = ^{
NSArray *arg = [JSContext currentArguments];
for (id obj in arg) {
NSLog(@"%@", obj);
}
};
}
其中 passValue 是JS的函数名，得到的 arg数组 里面为JS的 passValue 函数的参数，即 JS要传给OC的参数。
JS里要实现的代码：
function testClick()
{
var str1=document.getElementById("text1").value;
var str2=document.getElementById("text2").value;
passValue(str1,str2);
}
在需要给OC传值的函数里（例如：testClick（））直接调用 passValue（）函数，将值传进去即可。
第二种：JS给OC传值。
1. 技术方案：使用自定义url方法，每次点击网页
2. 使用场景： 网页中代码中的某个方法，比如点击事件方法，将该方法的参数传值给OC，供OC使用。
比如：携程APP中一个热门景点的网页中，有很多个热门景点，点击某个景点的图片或名称，可以跳转到原生中的该景点详情页控制器。
3. 代码实现如下：
JS里要实现的代码：
function testClick()
{
var str1=document.getElementById("text1").value;
var str2=document.getElementById("text2").value;
// "objc://"为自定义协议头;
// str1&str2为要传给OC的值,以":/"作为分隔
window.location.href="objc://"+":/"+str1+":/"+str2;
}
