美文网首页
iOS WebView 如何通过js获取网页中所有图片并加入点

iOS WebView 如何通过js获取网页中所有图片并加入点

作者: 白日一山 | 来源:发表于2016-12-09 10:52 被阅读0次

最近项目某个模块中要求可以实现对网页中图片的查看,并要求在多张图片的情况下可以实现滑动浏览。
所以,问题的集中点就是如何获取所有的图片地址及添加图片的点击事件。不多说,直接上码!

在网页加载完成时,通过js获取图片和添加点击的识别方式
- (void)webViewDidFinishLoad:(UIWebView *)webView {
[IDProgressHUD IDPlaceViewHideDirect:self.view];

//这里是js,主要目的实现对url的获取
static  NSString * const jsGetImages =
@"function getImages(){\
var objs = document.getElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i<objs.length;i++){\
imgScr = imgScr + objs[i].src + '+';\
};\
return imgScr;\
};";

[webView stringByEvaluatingJavaScriptFromString:jsGetImages];//注入js方法
NSString *urlResurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"];
mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]];
if (mUrlArray.count >= 2) {
    [mUrlArray removeLastObject];
}
//urlResurlt 就是获取到得所有图片的url的拼接;mUrlArray就是所有Url的数组

//添加图片可点击js
[mWebView stringByEvaluatingJavaScriptFromString:@"function registerImageClickAction(){\
 var imgs=document.getElementsByTagName('img');\
 var length=imgs.length;\
 for(var i=0;i<length;i++){\
 img=imgs[i];\
 img.onclick=function(){\
 window.location.href='image-preview:'+this.src}\
 }\
 }"];
[mWebView stringByEvaluatingJavaScriptFromString:@"registerImageClickAction();"];
}

//在这个方法中捕获到图片的点击事件和被点击图片的url
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

//预览图片
if ([request.URL.scheme isEqualToString:@"image-preview"]) {
    NSString* path = [request.URL.absoluteString substringFromIndex:[@"image-preview:" length]];
    path = [path stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
    //path 就是被点击图片的url
    return NO;
}
return YES;
}

后记:js挺好玩,我相信以后还会去多接触它。
全文转自:http://blog.csdn.net/u014544904/article/details/50479083

相关文章

网友评论

      本文标题: iOS WebView 如何通过js获取网页中所有图片并加入点

      本文链接:https://www.haomeiwen.com/subject/vaeemttx.html