• 【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('点击button了!');
            }
        </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  



  • 相关阅读:
    内置函数
    打印进度条
    生成器表达式
    Linux(CentOS7)安装Tomcat (Tomcat+JDK)
    IDEA左侧文件目录不见了,帮你找回来!
    前端插入date类型的数据到数据库
    Java Web制作登录 验证码
    Java使用数据库连接池连接Oracle数据库
    Java Web项目实现写日志功能
    IDEA编写JavaWeb出现乱码,成功解决!
  • 原文地址:https://www.cnblogs.com/mengfanrong/p/3884264.html
Copyright © 2020-2023  润新知