iOS开发日记27-WebView与JS的交互

今天博主有一个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> \n"

                         "<head> \n"

                         "<style type=\"text/css\"> \n"

                         "body {margin:10;font-size: %d;}\n"

                         "</style> \n"

                         "</head> \n"

                         "<body>%@</body> \n"

                         "</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中的方法

步骤:

*1.设置webView的代理<UIWebViewDelegate>
*2.在代理的方法shouldStartLoadWithRequest:中调用.(该方法与网页的加载有关)
*方法:就是在网页链接中写好自定义协议.然后在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

posted @ 2015-09-29 16:30  Mr.林的博客  阅读(638)  评论(0编辑  收藏  举报