今天博主有一个WebView与JS的交互的需求,遇到了一些困难点,在此和大家分享,希望能够共同进步.
WebView与JS的交互分为两种种方式:1.在OC中调用JS 2.在JS中调用OC
网页试用[NSString stringWithFormat:@"http://cn.bing.com"]
一.在OC中调用JS
直接上代码
-(void)webViewDidFinishLoad:(UIWebView *)webView
{
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.textContent"];//获取web页面内容信息，此处获取的是个json字符串
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"alert(1);"]];//显示并获取一个弹窗
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.location.href"];//获取当前页面的url
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.title"];//获取当前页面的title
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByName('q')[0].value='Mr.林';"];//修改当前页面的元素的值
// NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.forms[0].submit();"];//表单提交
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
[webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"
"script.type = 'text/javascript';"
"script.text = "function myFunction() { "
"var field = document.getElementsByName('q')[0];"
"field.value='Mr.林';"
"document.forms[0].submit();"
"}";"
"document.getElementsByTagName('head')[0].appendChild(script);"];
});
NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];
NSLog(@"*******%@",docStr);
}
PS:小技巧,WebView自带的属性是不可以改变字体大小颜色这些需求的，现在给出几种解决方案如下:
1.第一种方式：在WebView的代理方法webViewDidFinishLoad中：
字体大小： [webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '12%'"];
字体颜色：[webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.webkitTextFillColor= 'green'"];
背景颜色：[webView stringByEvaluatingJavaScriptFromString:@"document.getElementsByTagName('body')[0].style.background='#F6F7F3'"];
2.第二种方式：在下面可以通过改变margin大小来改变webview文字距离边距大小，13代表字体大小，self.strBookTips是要被操作的字符串。
NSString *BookStr = [NSString stringWithFormat:@"<html> "
"<head> "
"<style type="text/css"> "
"body {margin:10;font-size: %d;} "
"</style> "
"</head> "
"<body>%@</body> "
"</html>",13,self.strBookTips];
[self.webView loadHTMLString:BookStr baseURL:nil];
3.第三种方式，这种缺少了改变背景颜色
NSString * formatString = @"<span style="font-size:13px;color:#7E7C8A">%@</span>";
NSString * htmlString = [NSString stringWithFormat:formatString,self.strBookTips];
[self.webView loadHTMLString:BookStr baseURL:nil];
二.用超链接来调用OC中的方法
步骤：
代码如下：
/**=========================== 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];
}
http://www.tuicool.com/articles/vmyaUrM?plg_nld=1&plg_uin=1&plg_auth=1&plg_nld=1&plg_usr=1&plg_vkey=1&plg_dev=1