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

很多应用为了节约成本,做出同时在Android与iOS上都能使用的界面,这时就要使用WebView来做。Android和IOS上都有WebView,做起来很省事。当然这时就要考虑如何在Android或iOS中实现与网页的交互。对iOS而言,包括如何在网页中调用OC,以及如何在OC中对网页进行操作。

先将网页弄到iOS项目中:

网页内容如下, 仅供测试:

<html>
<head>
    <meta xmlns="http://www.w3.org/1999/xhtml" http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>这是一个示例html文件</title>
    <script Type='text/javascript'>
        function clickme() {
            alert('点击按钮了!');
        }
    </script>
</head>
<body>
    <h1>OC与JS互动</h1>
	<h2>blog.csdn.net/xn4545945</h2>
    <!-- 自定义协议与OC进行交互 -->
    <a href="neng://loadUrl/blog.csdn.net">点击一下, 链接调用OC函数</a>
    <br/>
    <br/>
    <a href="http://m.baidu.com">js注入, 到baidu页面上实验</a>
</body>
</html>

一、在OC中调用JS

最重要的方法:stringByEvaluatingJavaScriptFromString

直接上代码,说明见注释:

/**===========================OC 中调用 JS====================================*/
- (void)webViewDidFinishLoad:(UIWebView *)webView {
	//1.OC中调用JS的文档对象. (先拼出文档对象的属性) 可以在浏览器控制台输入来进行测试
	NSLog(@"%@", [self.webView stringByEvaluatingJavaScriptFromString:@"document.title"]);

	//2.OC中调用JS的方法
	[self.webView stringByEvaluatingJavaScriptFromString:@"clickme()"];
}

二、用超链接来调用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];
}

三、JS实现注入

JS是操作网页的利器,利用好JS才能真正在应用中随心所欲的操作网页。

核心方法:stringByEvaluatingJavaScriptFromString(与第一个相同,这个是在iOS中操作JS最重要方法)

代码如下:

/**===========================JS  注入====================================*/
- (void)jsClick {
	[self.webView stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"
	 "script.type = 'text/javascript';"
	 "script.text = \"function myFunction() { "   //定义myFunction方法
	 "var field = document.getElementsByName('word')[0];"
	 "field.value='WWDC2014';"
	 "document.forms[0].submit();"
	 "}\";"
	 "document.getElementsByTagName('head')[0].appendChild(script);"];  //添加到head标签中

	[self.webView stringByEvaluatingJavaScriptFromString:@"myFunction();"];
}




附上例子源码:http://download.csdn.net/detail/xn4545945/7584575


转载请注明出处:http://blog.csdn.net/xn4545945  



  • 5
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 7
    评论
iOS,通过WKWebView调用JS并传递多个参数的实现步骤如下: 1. 在JS代码定义需要调用的函数,并将需要传递的参数作为函数的参数。 例如,定义一个名为testFunc的函数,该函数有两个参数param1和param2: ``` function testFunc(param1, param2) { // ... } ``` 2. 在iOS,通过WKWebView的evaluateJavaScript方法调用JS函数并传递参数。 例如,调用上述testFunc函数并传递参数值为"hello"和"world"的示例代码如下: ``` NSString *jsFunction = [NSString stringWithFormat:@"testFunc('%@', '%@')", @"hello", @"world"]; [webView evaluateJavaScript:jsFunction completionHandler:^(id _Nullable result, NSError * _Nullable error) { // ... }]; ``` 其,NSString *jsFunction为需要调用JS函数及其参数的字符串形式,evaluateJavaScript方法会将该字符串作为JS代码执行。 在上述代码,使用NSString的stringWithFormat方法拼接JS函数及其参数的字符串形式,并将该字符串作为evaluateJavaScript方法的参数传入。注意,由于JS字符串需使用单引号括起来,所以需要在NSString的格式化字符串使用单引号。 3. 在JS,通过arguments对象获取传递的参数。 例如,在上述testFunc函数获取参数值的示例代码如下: ``` function testFunc(param1, param2) { console.log(arguments[0]); // 输出"hello" console.log(arguments[1]); // 输出"world" } ``` 通过arguments对象可以获取传递的参数值,其下标从0开始。 通过以上步骤,即可在iOS调用JS函数并传递多个参数。注意,如果需要传递的参数较多,可以使用数组等数据结构来进行传递。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值