IOS 原生与HTML交互

跟原生开发相比，H5的开发相对来一个成熟的框架和团队来讲在开发速度和开发效率上有着比原生很大的优势，至少不用等待审核。那么问题来了，H5与本地原生代码势必要有交互的，比如本地上传一些信息，H5打开本地的页面，打开本地进行微信等第三方分享等，今天就简单讲一下iOS中本地UIWebView,WKWebView与H5的交互。

DEMO地址：点击下载

UIWebView的交互

stringByEvaluatingJavaScriptFromString的使用

UIWebView在2.0时代就有的类，一直到现在（目前9.x）都可以使用的WEB容器，它的方法很简单，在iOS7.0之前JS交互的方法只有一个stringByEvaluatingJavaScriptFromString:

- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;

使用stringByEvaluatingJavaScriptFromString方法，需要等UIWebView中的页面加载完成之后去调用.

以下是简单的使用场景：

1、获取当前页面的url。

- (void)webViewDidFinishLoad:(UIWebView *)webView {      
    NSString *currentURL = [webView stringByEvaluatingJavaScriptFromString:@"document.location.href"];  
} 

2、获取页面title：

- (void)webViewDidFinishLoad:(UIWebView *)webView {       
        NSString *currentURL = [webView stringByEvaluatingJavaScriptFromString:@"document.location.href"];     
NSString *title = [webview stringByEvaluatingJavaScriptFromString:@"document.title"];  
} 

3、修改界面元素的值。

NSString *js_result = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByName('q')[0].value='iOS';"]; 

4、表单提交：

NSString *js_result2 = [webView stringByEvaluatingJavaScriptFromString:@"document.forms[0].submit(); "]; 

这样就实现了在google搜索关键字：“iOS”的功能。
5、插入js代码
上面的功能我们可以封装到一个js函数中，将这个函数插入到页面上执行，代码如下：

    "script.type = 'text/javascript';"            
    "script.text = \"function myFunction() { "            
    "var field = document.getElementsByName('q')[0];"             
    "field.value='iOS';"            
    "document.forms[0].submit();"   
    "}\";"     
    "document.getElementsByTagName('head')[0].appendChild(script);"];    
    
    [webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];   

看上面的代码：

a、首先通过js创建一个script的标签，type为'text/javascript'。
b、然后在这个标签中插入一段字符串，这段字符串就是一个函数：myFunction，这个函数实现google自动搜索关键字的功能。
c、然后使用stringByEvaluatingJavaScriptFromString执行myFunction函数。

6、直接调用JS函数