【iOS】OC与JS交互网页中调用JS与JS注入

最新推荐文章于 2021-06-03 06:56:30 发布

Larry_qidian

最新推荐文章于 2021-06-03 06:56:30 发布

阅读量731

点赞数

分类专栏： OC和JS交互文章标签： ios ios开发 javascript webview

OC和JS交互专栏收录该内容

1 篇文章 0 订阅

订阅专栏

很多应用为了节约成本，做出同时在Android与iOS上都能使用的界面，这时就要使用WebView来做。Android和IOS上都有WebView，做起来很省事。当然这时就要考虑如何在Android或iOS中实现与网页的交互。对iOS而言，包括如何在网页中调用OC，以及如何在OC中对网页进行操作。

先将网页弄到iOS项目中：

网页内容如下，仅供测试：

[html]view plaincopy 
   
 <html>  
 <head>  
     <meta xmlns="http://www.w3.org/1999/xhtml" http-equiv="Content-Type" content="text/html; charset=utf-8" />  
     <title>这是一个示例html文件</title>  
     <script Type='text/javascript'>  
         function clickme() {  
             alert('点击按钮了！');  
         }  
     </script>  
 </head>  
 <body>  
     <h1>OC与JS互动</h1>  
     <h2>blog.csdn.net/xn4545945</h2>  
     <!-- 自定义协议与OC进行交互 -->  
     <a href="neng://loadUrl/blog.csdn.net">点击一下, 链接调用OC函数</a>  
     <br/>  
     <br/>  
     <a href="http://m.baidu.com">js注入, 到baidu页面上实验</a>  
 </body>  
 </html>  

一、在OC中调用JS

最重要的方法：stringByEvaluatingJavaScriptFromString

直接上代码，说明见注释：

[objc]view plaincopy 
   
 /**===========================OC 中调用 JS====================================*/  
 - (void)webViewDidFinishLoad:(UIWebView *)webView {  
     //1.OC中调用JS的文档对象. (先拼出文档对象的属性) 可以在浏览器控制台输入来进行测试  
     NSLog(@"%@", [self.webView stringByEvaluatingJavaScriptFromString:@"document.title"]);  
   
     //2.OC中调用JS的方法  
     [self.webView stringByEvaluatingJavaScriptFromString:@"clickme()"];  
 }  

二、用超链接来调用OC中方法

步骤：

* 1. 设置 webView 的代理 < UIWebViewDelegate >

* 2 . 在代理的方法 shouldStartLoadWithRequest : 中调用 . ( 该方法与网页的加载有关 )

* 方法 : 就是在网页链接中写好自定义协议 . 然后在 OC 方法中检查点击的链接中是否有该协议 , 有则做相关操作 .

代码如下：

[objc]view plaincopy 
   
 /**=========================== webView链接 中调用 OC===============================*/  
 /**webView的代理方法:加载页面有关. 当直接返回为NO时,会调用JS方法 
    其中request参数与发送请求有关*/  
 - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {  
     NSLog(@"%@", request.URL.absoluteString); //可以直接拿到发送请求的网址  
     NSString *urlStr = request.URL.absoluteString;  
   
     // 格式 neng://loadUrl/blog.csdn.net  协议/方法/网址  
     //判断链接中的协议头,如果是neng://, 则进行相关操作  
     if ([urlStr hasPrefix:@"neng://"]) {  
         //拿到除去协议头的后部  
         NSString *urlContent = [urlStr substringFromIndex:[@"neng://" length]];  
         NSLog(@"%@", urlContent);  
   
         //用/来拆分字符串  
         NSArray *urls = [urlContent componentsSeparatedByString:@"/"];  
         NSLog(@"拆分的结果为:%@", urls);  
   
         //取出方法名  
         if (urls.count != 2) {  
             return NO;  
         }  
         NSString *funName = [NSString stringWithFormat:@"%@:", urls[0]]; //带参数的方法,加冒号  
   
         SEL callFun = NSSelectorFromString(funName);  
 //取消警告  
 # pragma clang diagnostic push  
 # pragma clang diagnostic ignored "-Warc-performSelector-leaks"  
         [self performSelector:callFun withObject:urls[1]]; //将blog.csdn.net作为参数传入  
 # pragma clang diagnostic pop  
         NSLog(@"方法名为%@, 传入参数为%@", funName, urls[1]);  
   
         return NO;  
     }  
   
     return YES;  
 }  
   
 - (void)loadUrl:(NSString *)urlStr {  
     NSLog(@"接收到参数: %@", urlStr);  
   
     //跳转到指定的URL--->urlStr  
     NSURL *url = [NSURL URLWithString:[NSString stringWithFormat:@"http://%@", urlStr]];  
     NSURLRequest *request = [NSURLRequest requestWithURL:url];  
   
     [self.webView loadRequest:request];  
 }  

三、JS实现注入

JS是操作网页的利器，利用好JS才能真正在应用中随心所欲的操作网页。

核心方法：stringByEvaluatingJavaScriptFromString（与第一个相同，这个是在iOS中操作JS最重要方法）

代码如下：

[objc]view plaincopy 
   
 /**===========================JS  注入====================================*/  
 - (void)jsClick {  
     [self.webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"  
      "script.type = 'text/javascript';"  
      "script.text = \"function myFunction() { "   //定义myFunction方法  
      "var field = document.getElementsByName('word')[0];"  
      "field.value='WWDC2014';"  
      "document.forms[0].submit();"  
      "}\";"  
      "document.getElementsByTagName('head')[0].appendChild(script);"];  //添加到head标签中  
   
     [self.webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];  
 }  

附上例子源码：http://download.csdn.net/detail/xn4545945/7584575

转载请注明出处：http://blog.csdn.net/xn4545945

Larry_qidian

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【iOS】OC与JS交互网页中调用JS与JS注入

很多应用为了节约成本，做出同时在Android与iOS上都能使用的界面，这时就要使用WebView来做。Android和IOS上都有WebView，做起来很省事。当然这时就要考虑如何在Android或iOS中实现与网页的交互。对iOS而言，包括如何在网页中调用OC，以及如何在OC中对网页进行操作。先将网页弄到iOS项目中：网页内容如下，仅供测试：[html
复制链接

扫一扫