js

参考:
1.uiwebview与js交互

2.通过JS控制ViewController

3.NSURL 基本方法 absoluteString

4.【iOS】网页中调用JS与JS注入

5.UIWebView加载本地HTML5文件

6.JS的Document属性

7.stringByEvaluatingJavaScriptFromString的使用方法

8.JavaScriptCore 使用

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交互

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,080评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,422评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,630评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,554评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,662评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,856评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,014评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,752评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,212评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,541评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,687评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,347评论 4 331
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,973评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,777评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,006评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,406评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,576评论 2 349

推荐阅读更多精彩内容

  • 随着H5技术的兴起,在iOS开发过程中,难免会遇到原生应用需要和H5页面交互的问题。其中会涉及方法调用及参数传值等...
    Chris_js阅读 3,062评论 1 8
  • 最近整理了一下原生与H5之间的交互方式,简单的做个总结。OC端与JS的交互,大致有这几种:拦截协议、JavaScr...
    谈Xx阅读 31,108评论 41 75
  • 最近在做的项目重点就是原生app与js的交互,以前也做过但是并没有深入的了解和研究过,因为这个项目我尝试了三种方式...
    Www刘阅读 14,219评论 3 53
  • 一、简介 近两年随着HTML5的迅速发展与日趋成熟,越来越多的移动开发者选择使用HTML5来进行混合开发,不仅节约...
    RainyGY阅读 1,860评论 1 12
  • 中秋节拾着夏的岁末,迎着秋的惬意潸然而至, 似时钟滴答、滴答, 送走了夏的繁忙炙热,迎来了秋的清新凉爽, 也迎来国...
    乌市大掌柜邢家利阅读 237评论 0 0