参考:
1.uiwebview与js交互
7.stringByEvaluatingJavaScriptFromString的使用方法
9.JavaScript:浅谈iOS与H5的交互-JavaScriptCore框架
使用stringByEvaluatingJavaScriptFromString方法,需要等UIWebView中的页面加载完成之后去调用。我们在界面上拖放一个UIWebView控件。在Load中将googlemobile加载到这个控件中,代码如下:
- (void)viewDidLoad
{
[super viewDidLoad];
webview.backgroundColor = [UIColor clearColor];
webview.scalesPageToFit =YES;
webview.delegate =self;
NSURL *url =[[NSURL alloc] initWithString:@"http://www.google.com.hk/m?gl=CN&hl=zh_CN&source=ihp"];
NSURLRequest *request = [[NSURLRequest alloc] initWithURL:url];
[webview loadRequest:request];
}
我们在webViewDidFinishLoad方法中就可以通过javascript操作界面元素了。
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='朱祁林';"];
4、表单提交:
NSString *js_result2 = [webView stringByEvaluatingJavaScriptFromString:@"document.forms[0].submit(); "];
这样就实现了在google搜索关键字:“朱祁林”的功能。
5、插入js代码
上面的功能我们可以封装到一个js函数中,将这个函数插入到页面上执行,代码如下:
1. [webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script'); script.type = 'text/javascript'
script.text =function myFunction() {var field = document.getElementsByName('q')[0];field.value='朱祁林';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函数。
演示:
第一步打开google mobile网站
第二步输入关键字
第三步搜素
-(void)webViewDidFinishLoad:(UIWebView *)webView{
NSString *title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];
[self setTitle:title];
// 禁用用户选择
[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitUserSelect='none';"];
// 禁用长按弹出框
[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitTouchCallout='none';"];
// 隐藏titleBar
[webView stringByEvaluatingJavaScriptFromString:@"document.getElementById('titlebar').style.display = 'none';"];
NSString *backUrl = [webView stringByEvaluatingJavaScriptFromString:@"document.getElementById('back').href"];
_backUrl = backUrl;
if ([backUrl isEqualToString:@""]) {
_backBtnItem.customView.hidden = YES;
}else{
_backBtnItem.customView.hidden = NO;
}
}
可以拦截web请求。本来是web内部跳转,现跳转到原生的控制器
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSString *urlTempString = request.URL.absoluteString;
NSLog(@"urlTempString==:%@",urlTempString);
if (![urlTempString isEqualToString:@"http://www.huafax.com/lbt"]&&![urlTempString isEqualToString:@"http://www.huafax.com/lbt/"]) {
ADActivityViewController *activityVC = [ADActivityViewController new];
// activityVC.title = @"活动";
activityVC.urlString = urlTempString;
[self.navigationController pushViewController:activityVC animated:YES];
return NO;
}
return YES;
}
http://www.cnblogs.com/yansheng/archive/2010/01/25/1656014.html
交互方式有三种:
- 1.UIWebviewDelegate
- 2.JavaScriptCore
- 3.WebViewJavascriptBridge
按照排序给大家介绍一下,我推荐前两种方法,第三种需要依赖第三方框架,并且不一定能拦截成功,所以着重介绍前两种,第三种知道怎么操作就行了
JavaScriptCore
这个是iOS7之后苹果推出的一个JS于OC交互的一个框架,极大的方便了我们对js的操作
相关的几个类
/*
JS执行的环境,同时也通过JSVirtualMachine管理着所有对象的生命周期,每个JSValue都和JSContext相关联并且强引用context。
*/
#import "JSContext.h"
/*
JS对象在JSVirtualMachine中的一个强引用,其实就是Hybird对象。我们对JS的操作都是通过它。并且每个JSValue都是强引用一个context。同时,OC和JS对象之间的转换也是通过它
*/
#import "JSValue.h"
/*
JS和OC对象的内存管理辅助对象。由于JS内存管理是垃圾回收,并且JS中的对象都是强引用,而OC是引用计数。如果双方相互引用,势必会造成循环引用,而导致内存泄露。我们可以用JSManagedValue保存JSValue来避免。
*/
#import "JSManagedValue.h"
/*
JS运行的虚拟机,有独立的堆空间和垃圾回收机制。
*/
#import "JSVirtualMachine.h"
/*
一个协议,如果JS对象想直接调用OC对象里面的方法和属性,那么这个OC对象只要实现这个JSExport协议就可以了。
*/
#import "JSExport.h"
接下来就是如何去通过js来调用oc的方法了
//首先你要在本地的html文件里注册一个按钮,按钮的打击名字jsButton
<!DOCTYPE HTML>
<html lang="zh-CN">
<body>
<p>JavaScriptCore测试页面</p>
<body>
<button onclick="jsButton()">JS按钮</button>
</body>
</html>
//然后在加载完成的方法里通过JSContext来获取相应操作的key值.key值是html文件里点击方法的名字,并且调用你需要的操作
- (void)webViewDidFinishLoad:(UIWebView *)webView {
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
context[@"jsButton"] = ^{
//在这里调用你需要的操作
UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"点击了JS按钮" message:@"" preferredStyle:(UIAlertControllerStyleAlert)];
UIAlertAction *sureAlertAction = [UIAlertAction actionWithTitle:@"OK" style:(UIAlertActionStyleDefault) handler:^(UIAlertAction * _Nonnull action) {
}];
[alert addAction:sureAlertAction];
[self presentViewController:alert animated:YES completion:^{
}];
};
}
WebViewJavascriptBridge
第三种方法是通过WebViewJavascriptBridge这个第三方库,把js和oc之间搭建一个桥,来实现相互通信,这个是我最不推荐的一种方法,因为他需要依赖第三方库来实现,通过互相注册方法,增加代码量并且并不是每次方法都能注册上,有一定的失败几率,由于不推荐,所以就安排在最后,不做太详细的解释
史上最全的UIWebview的JS与OC交互