iOS中OC和JS之间的互调的用法

一、删除网页中对应的标签:OC调用JS代码

- (void)webViewDidFinishLoad:(UIWebView *)webView

{
 
// JS的代码

   
NSMutableString *JSStM = [NSMutableString string];
   
/**

    
①找到要删除的对应的标签：var headerTag = document.getElementsByTagName('header')[0];

    
②找到要删除的标签对应的父节点：headerTag.parentNode

    
③从父节点中将要删除的标签移除：headerTag.parentNode.removeChild(headerTag);

    
*/

   
// 删除导航

   
[JSStM appendString:
@"var headerTag = document.getElementsByTagName('header')[0];headerTag.parentNode.removeChild(headerTag);"
];

   
// 删除中间的“立即购买”按钮

   
[JSStM appendString:
@"var buyTag = document.getElementsByClassName('buy-now')[0];buyTag.parentNode.removeChild(buyTag);"
];
   
// 删除底部"APP下单返积分抵现金”悬停按钮

   
[JSStM appendString:@"var footerBtnTag = document.getElementsByClassName('footer-btn-fix')[0]; footerBtnTag.parentNode.removeChild(footerBtnTag);"
];

  

   
// 删除底部“各种信息”布局

   
[JSStM appendString:
@"var footerTag = document.getElementsByClassName('footer')[0]; footerTag.parentNode.removeChild(footerTag);"
];

  

   
// 给标签“顶部的图片”添加点击事件

   
/**

    
①JS中给标签添加相应的事件：弹框

    
var figureTag = document.getElementsByTagName('figure')[0].children[0];figureTag.onclick = function(){alert("点我点我点我")};

    
②通过点击某个标签跳转到其他链接：给图片添加点击事件

    
var figureTag = document.getElementsByTagName('figure')[0].children[0];figureTag.onclick = function(){window.location.href = 'http://www.baidu.com'};

    

    
跳转到百度中的OC调用JS代码

    
[JSStM appendString:@"var figureTag = document.getElementsByTagName('figure')[0].children[0];figureTag.onclick = function(){window.location.href = 'http://www.baidu.com'};"];

   
*/

   
// 通过自定义协议头的方式来实现控制器间的跳转，即JS调用OC代码

//    [JSStM appendString:@"var figureTag = document.getElementsByTagName('figure')[0].children[0]; figureTag.onclick = function(){window.location.href = 'xg://?src= '+this.src};"];

   
// 也可写成一下代码

   
[JSStM appendString:
@"var figureTag = document.getElementsByTagName('figure')[0].children[0]; figureTag.onclick = function(){window.location.href = 'xg://www.hahah.com'};"
];

  

   
// OC调用JS代码

   
[webView stringByEvaluatingJavaScriptFromString:JSStM];

  

}

二、通过网页中的JS代码跳转到控制器界面：JS调用OC的代码

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest
*)request navigationType:(UIWebViewNavigationType)navigationType

{
  
NSLog
(
@"%@"
,request.URL.absoluteString);

// 拿到网页上的请求地址

    
NSString
*URLString = request.URL.absoluteString;

    
// 判断网页的请求地址协议是否是我们自定义的那个

    
NSRange
range = [URLString rangeOfString:
@"xg://?src="
];

//    if (range.length > 0) {

    
if
([URLString isEqualToString:
@"xg://www.hahah.com"
]){

                
NSLog
(
@"你点击的是图片"
);

        
 
        
// 控制器的跳转

        
[self.navigationController popToRootViewControllerAnimated:YES];

        
// 拦截到的这个自定义协议的请求时,我是不需要做网页加载的,就返回NO.

        
return NO
;

        
/**
         
温馨提醒:

         
①这里点击标签之后,如果不需要加载任何的网页,就需要return NO;
         
②如果需求是 : 点击网页的分享图标(按钮),跳转到分享页面,业务逻辑跟点击图片实现跳转是一样的,只需要在网页中找到那个分享的标签,确定他的点击事件并发送一个自定义协议头的请求,然后拦截这个特殊协议头的请求即可

         
*/

    
} 
    
return YES
;
}