IOS OC与js交互详解
站在用户的角度思考问题，与客户深入沟通，找到宏伟网站设计与宏伟网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：成都网站建设、网站制作、企业官网、英文网站、手机端网站、网站推广、申请域名、雅安服务器托管、企业邮箱。业务覆盖宏伟地区。
JS注入 : 把JS代码有OC注入到网页
JS注入又叫做OC和JS的交互
OC和JS的交互需要一个桥梁(中介),这个桥梁就是UIWebView的代理方法
网页加载初始内容
#import "ViewController.h" @interface ViewController ()@property (weak, nonatomic) IBOutlet UIWebView *webView; @end - (void)viewDidLoad { [super viewDidLoad]; // 设置webView的代理 self.webView.delegate = self; // 加载网页数据 NSURL *URL = [NSURL URLWithString:@"http://m.dianping.com/tuan/deal/5501525"]; // NSURL *URL = [NSURL URLWithString:@"https://www.hao123.com/?tn=93321723_hao_pg"]; NSURLRequest *request = [NSURLRequest requestWithURL:URL]; [self.webView loadRequest:request]; }
在UIWebView的代理方法里用js来更改原生网页
/// 网页加载完成之后调用的代理方法 : JS注入 : OC调用JS代码
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
// 用于拼接JS代码的字符串
NSMutableString *stringM = [NSMutableString string];
// 拼接移除顶部导航的JS代码
[stringM appendString:@"var headerTag = document.getElementsByTagName('header')[0]; headerTag.parentNode.removeChild(headerTag);"];
// 拼接移除橙色按钮的JS代码
[stringM appendString:@"var footerBtnTag = document.getElementsByClassName('footer-btn-fix')[0]; footerBtnTag.parentNode.removeChild(footerBtnTag);"];
// 拼接移除底部布局的JS代码
[stringM appendString:@"var footerTag = document.getElementsByClassName('footer')[0]; footerTag.parentNode.removeChild(footerTag);"];
// 拼接给img标签添加点击事件的JS代码
[stringM appendString:@"var imgTag = document.getElementsByTagName('figure')[0].children[0]; imgTag.onclick = function(){window.location.href='https://www.baidu.com'};"];
// 这个方法就是UIWebView提供的.专门做JS注入的方法
[webView stringByEvaluatingJavaScriptFromString:stringM];
}
拦截原生网络请求网页跳转
imgTag.onclick = function(){window.location.href='https://www.baidu.com‘} 点击imgTag时,主动发送网络请求
主动发送网络请求的目的 : 就是为了让UIWebView能够拦截到我的自定义的URL
通过自定义的URL,判断 / 区别 我点击的标签是否是我设计的那个标签
自定义独一无二的URL,表示点击的是独一无二的标签
总结起来就是两步
第一步 : JS注入标签的点击事件,并主动发送一个自定义的URL的请求
第二步 : 在UIWebView里面.拦截自定义的URL的请求,然后判断请求
JS间接调用OC : JS和OC的交互
网页即将开始加载时调用的代理方法 : 可以拦截到webView上的所有的网络请求
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
// 获取拦截到的所有的请求
NSString *URLString = request.URL.absoluteString;
//https://m.baidu.com/?from=1015143h
// NSLog(@"%@",URLString);
if ([URLString isEqualToString:@"https://m.baidu.com/?from=1015143h"]) {
NSLog(@"我点击的是imgTag");
// 当我知道点击的是imgTag时,自动push
//http://www.csdn.net/
NSURL *URL = [NSURL URLWithString:@"http://www.csdn.net/"];
NSURLRequest *request = [NSURLRequest requestWithURL:URL];
[self.webView loadRequest:request];
// TestViewController *testVC = [[TestViewController alloc] init];
// [self.navigationController pushViewController:testVC animated:YES];
// 因为这个地址是无效地址.不需要加载的
return NO;
}
// 返回YES的作用 : 表示你拦截到的请求,允许正常的发送出去;反之,不允许拦截到的请求发送出去
return YES;
}
感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！