iOS中使用UIWebView与JS进行交互

前一段忙着面试和复习，这两天终于考完试了，下学期的实习也有了着落，把最近学的东西更新一下，首先是使用UIWebView与JS进行交互

在webView中我静态获取了一个有图片的网页，我想为每张图片添加点击事件，就必须用到JS了

首先创建JS文件，如下：

 //给每张img添加点击事件

 function setImageClickFunction(){

   var imgs = document.getElementsByTagName("img");

   for (var i=0;i<imgs.length;i++){

     var src = imgs[i].src;

     imgs[i].setAttribute("onClick","change_pic(src)");

   }

   document.location = imageurls;

 }

 //点击图片后返回给OC的回调函数

 function change_pic(imagesrc){

   var url = imagesrc;

 //  window.open("www.baidu.com")

   document.location = url;

 }

之后在HTML中插入该JS文件，并且在<body>​中调用setImageClickFunction函数

在这里因为调用的是返回JSON的API，其中包含静态HTML和CSS链接，如果是动态网页直接load的话，在webViewWillLoad:函数中调用你的JS函数即可

 //在加载静态Web这种情况下

 NSString *js = [NSString stringWithFormat:@"<script type=\"text/javascript\">%@</script>", [NSString stringWithContentsOfURL:[[NSBundle mainBundle] URLForResource:@"ClickImage" withExtension:@"js"] encoding:NSUTF8StringEncoding error:nil]];

 NSString *html = [NSString stringWithFormat:@"<html><head>%@<link rel=\"stylesheet\" href=%@></head><body>%@</body></html>", js, css, body];

 [self.webView loadHTMLString:html baseURL:nil];

 //调用JS中的函数，为图片添加点击事件

 - (void)webViewDidFinishLoad:(UIWebView *)webView {

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

 }

这样就为所有的图片添加了点击事件，在点击图片后，js回调给oc的下面方法

 - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

   NSLog(@"%@", request.URL.absoluteStrting);

 }

在上面的方法中可以对回调的如这样的"https://pic3.zhimg.com/b4f7acc26514fb634131b04a430e6cbf_b.jpg”String进行其他处理

在其他情况也可以调用下面的方法插入JS语句，或调用JS函数
[self.webView stringByEvaluatingJavaScriptFromString:string];
 
 
最后附上document、location、body属性方法JS对象

document：属性

document.title                 //设置文档标题等价于HTML的<title>标签

document.bgColor               //设置页面背景色

document.fgColor               //设置前景色(文本颜色)

document.linkColor             //未点击过的链接颜色

document.alinkColor            //激活链接(焦点在此链接上)的颜色

document.vlinkColor            //已点击过的链接颜色

document.URL                   //设置URL属性从而在同一窗口打开另一网页

document.fileCreatedDate       //文件建立日期，只读属性

document.fileModifiedDate      //文件修改日期，只读属性

document.fileSize              //文件大小，只读属性

document.cookie                //设置和读出cookie

document.charset               //设置字符集 简体中文:gb2312

document：方法

document.write()                      //动态向页面写入内容

document_createElement_x_x(Tag)           //创建一个html标签对象

document.getElementByIdx_x_x(ID)           //获得指定ID值的对象

document.getElementsByName(Name)      //获得指定Name值的对象

document.body.a(oTag)

body：子对象

document.body                   //指定文档主体的开始和结束等价于<body></body>

document.body.bgColor           //设置或获取对象后面的背景颜色

document.body.link              //未点击过的链接颜色

document.body.alink             //激活链接(焦点在此链接上)的颜色

document.body.vlink             //已点击过的链接颜色

document.body.text              //文本色

document.body.innerText         //设置<body>...</body>之间的文本

document.body.innerHTML         //设置<body>...</body>之间的HTML代码

document.body.topMargin         //页面上边距

document.body.leftMargin        //页面左边距

document.body.rightMargin       //页面右边距

document.body.bottomMargin      //页面下边距

document.body.background        //背景图片

document.body.a(oTag) //动态生成一个HTML对象

location：子对象

document.location.hash          // #号后的部分

document.location.host          // 域名+端口号

document.location.hostname      // 域名

document.location.href          // 完整URL

document.location.pathname      // 目录部分

document.location.port          // 端口号

document.location.protocol      // 网络协议(http:)

document.location.search        // ?号后的部分

常用对象事件:

documeny.location.reload()          //刷新网页

document.location.reload(URL)       //打开新的网页

document.location.assign(URL)       //打开新的网页

document.location.replace(URL)      //打开新的网页

selection-选区子对象

document.selection

iOS中使用UIWebView与JS进行交互的更多相关文章

  1. UIWebView与JS的交互

    IOS-的UIWebView UIWebVew是ios开发中较为常用的一个控件.其可以打开网页,加载html,打开文档等.当我们在开发中需要用到一些显示页面时,UIWebView是一个很好的选择. 创 ...

  2. UIWebview与js交互[转]

    UIWebView是iOS最常用的SDK之一,它有一个stringByEvaluatingJavaScriptFromString方法可以将javascript嵌入页面中,通过这个方法我们可以在iOS ...

  3. iOS开发之Objective-C与JavaScript的交互(转载)

    UIWebView是iOS最常用的SDK之一,它有一个stringByEvaluatingJavaScriptFromString方法可以将javascript嵌入页面中,通过这个方法我们可以在iOS ...

  4. iOS开发之Objective-C与JavaScript的交互

    UIWebView是iOS最常用的SDK之一,它有一个stringByEvaluatingJavaScriptFromString方法可以将javascript嵌入页面中,通过这个方法我们可以在iOS ...

  5. UIWebView与JavaScript的交互

    UIWebView是iOS最常用的SDK之一,它有一个stringByEvaluatingJavaScriptFromString方法可以将javascript嵌入页面中,通过这个方法我们可以在iOS ...

  6. 【Swift】WKWebView与JS的交互使用

    一.前言 近日,有朋友问我关于WKWebView与JS的交互问题,可我之前一直使用的是UIWebView,也不曾做过WKWebView的交互啊!接下来大家一块学习下WKWebView是怎么实现原生代码 ...

  7. iOS中UIWebView使用JS交互 - 机智的新手

    iOS中偶尔也会用到webview来显示一些内容,比如新闻,或者一段介绍.但是用的不多,现在来教大家怎么使用js跟webview进行交互. 这里就拿点击图片获取图片路径为例: 1.测试页面html & ...

  8. iOS中UIWebView使用JS交互

    iOS中偶尔也会用到webview来显示一些内容,比如新闻,或者一段介绍.但是用的不多,现在来教大家怎么使用js跟webview进行交互. 这里就拿点击图片获取图片路径为例: 1.测试页面html & ...

  9. iOS中JS 与OC的交互(JavaScriptCore.framework)

    iOS中实现js与oc的交互,目前网上也有不少流行的开源解决方案: 如:react native 当然一些轻量级的任务使用系统提供的UIWebView 以及JavaScriptCore.framewo ...

随机推荐

  1. 总结iOS 8和Xcode 6的各种坑

    模拟器的路径从之前的~/Library/Application Support/iPhone Simulator移动到了~/Library/Developer/CoreSimulator/Device ...

  2. 【ZOJ】3430 Detect the Virus

    动态建树MLE.模仿别人的代码模板各种原因wa后,终于AC. #include <iostream> #include <cstdio> #include <cstrin ...

  3. Going Home(最小费用最大流)

    Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 16200   Accepted: 8283 Description On a ...

  4. Linux Shell编程（1）——shell编程简介

    Shell是一个命令解释器.它不仅是操作系统内核与用户之间的绝缘层,同时也是一种功能相当强大的编程语言.一个Shell程序,通常称为脚本,它是一个由系统调用,命令工具,软件包和已编译的二进制包&quo ...

  5. Qt入门（8）——事件和事件过滤器

    在Qt里,一个事件是继承自QEvent的对象.事件通过调用QObject::event(),被发送到继承自 QObject 的对象.事件发送就是一个事件已经产生,由 QEvent正好去表达,且QObj ...

  6. （转载）PCNTL函数族--PHP多进程编程

    (转载)http://www.cnblogs.com/zox2011/archive/2013/02/19/2917448.html php有一组进程控制函数,使得php能在*nix系统中实现跟c一样 ...

  7. C#调用webservers实现天气预报

    一:截图 二:实现步骤 1.引入Web服务.在VS中项目上右击→添加服务引用. 2.在弹出的添加服务引用窗口,录入web服务地址和引用后的命名空间. 三:源代码 using System; using ...

  8. kafka消息监控-KafkaOffsetMonitor

    参照site:https://github.com/quantifind/KafkaOffsetMonitor 一.简述 这个应用程序用来实时监控Kafka服务的Consumer以及它们所在的Part ...

  9. 敏捷开发 and 敏捷测试

    名词解释 agile: 敏捷的:灵活:敏捷开发. scrum: 扭打,混打:并列争球:参加并列争球. sprint:  冲刺,全速跑. backlog: 积压的工作:积压待办的事务. retrospe ...

  10. STM8S 独立看门狗配置及使用

    //独立看门口的时钟来源 内部低速时钟 128khz 除以2 即64khz //选择 IWDG_Prescaler_128 //64/128 =0.5 khz 2ms周期 #define IWDG_5 ...