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进行其他处理
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