UIWebView的应用与其与JS的混编

来源：互联网发布：mac os x 10.9 下载编辑：程序博客网时间：2024/06/10 04:59

iOS中偶尔也会用到webview来显示一些内容，比如新闻，或者一段介绍。但是用的不多，现在来教大家怎么使用js跟webview进行交互。

这里就拿点击图片获取图片路径为例：

1.测试页面html

<!doctype html><html>  <head>      </head>  <body>    <div>            <img src="test.png"/>          </div>  </body></html>

2.然后我们在controller中加载这一段html

[_webview loadRequest:[NSURLRequest requestWithURL:[[NSBundle mainBundle]URLForResource:@"work" withExtension:@"html"]]];

3.可以看到，这里只显示一张图片

4.加载相关js文件,命名为test.js

function setImageClickFunction(){  var imgs = document.getElementsByTagName("img");  for (var i=0;i<imgs.length;i++){    var src = imgs[i].src;    imgs[i].setAttribute("onClick","click(src)");  }  document.location = imageurls;}function click(imagesrc){  var url="ClickImage:"+imagesrc;  document.location = url;}

这里说下两个方法的意思（对那些不熟悉js的有帮助）：第一个是给你的webview里所有图片加上点击事件，第二个方法为点击后返回图片的URL，关于接收这个URL下面说。

5.在controller中加载这一段js代码

[_webview stringByEvaluatingJavaScriptFromString:[NSString stringWithContentsOfURL:[[NSBundle mainBundle] URLForResource:@"test" withExtension:@"js"] encoding:NSUTF8StringEncoding error:nil]];

你还可以直接把js代码放到html中，效果是一样的。

6.在webview的代理方法中，我们用去调用第一个js方法

-(void)webViewDidFinishLoad:(UIWebView *)webView{     [_webview stringByEvaluatingJavaScriptFromString:@"setImageClickFunction()"];}

，这里也就是说在webview加载完后给他绑定上点击事件。好了，最后就是接收URL了

7.接收js返回值,当点击图片的时候会实现这个代理方法（每次加载webview都会显示），然后我们输出他的返回值看看

-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{    NSString *path=[[request URL] absoluteString];    NSLog(@"%@",path);  return YES;}

2014-10-03 19:39:37.099 webview[31153:60b] ClickImage:file:///Users/zhiwupei/Library/Application%20Support/iPhone%20Simulator/7.1-64/Applications/C4F814F6-088D-444F-A508-40AB5C775567/webview.app/test.png

可以看到控制台打印了图片路径出来。因为这里用的是本地图片，网络图片也是同样的道理。这样就可以实现点击图片获取到他的路径了。

iphone 获取UIWebView内Html方法

获取所有html:NSString *lJs = @"document.documentElement.innerHTML";
获取网页title:NSString *lJs2 = @"document.title";
UIWebView *lWebView = [self getCurrentWebView];
NSString *lHtml1 = [lWebView stringByEvaluatingJavaScriptFromString:lJs];
NSString *lHtml2 = [lWebView stringByEvaluatingJavaScriptFromString:lJs2];

JavaScript获取网页信息总结

JavaScript获取当前页面URL、title等，具体怎么用就看自己了～
由于本站用了伪静态，所以获取不到文档名.document.location.port;是获取URL关联的端口号码，thisHash = document.location.hash;是获取链接属性中在井号“#”后面的分段。

thisURL = document.URL;

thisHREF = document.location.href;

thisSLoc = self.location.href;

thisDLoc = document.location;

thisTLoc = top.location.href;

thisPLoc = parent.document.location;

thisTHost = top.location.hostname;

thisHost = location.hostname;

thisTitle = document.title;

thisProtocol = document.location.protocol;

thisPort = document.location.port;

thisHash = document.location.hash;

thisSearch = document.location.search;

thisPathname = document.location.pathname;

thisHtml = document.documentElement.innerHTML;

thisBodyText = document.documentElement.innerText;//获取网页内容文字
thisBodyText = document.body.innerText;//获取网页内容文字

0 0