OC与JS的互调

来源:互联网 发布:1加到100的c语言程序 编辑:程序博客网 时间:2024/06/08 03:36
iOS开发免不了要与UIWebView打交道,然后就要涉及到JS与原生OC交互,今天总结一下JS与原生OC交互的两种方式

一、删除网页中对应的标签: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的代码;这种方式是用JS发起一个假的URL请求,然后利用UIWebView的代理方法拦截这次请求,然后再做相应的处理。

- (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;}
1 0
原创粉丝点击