本文介绍如何从H5网页上获取到该网页上的图片及给图片添加上点击事件,通过Demo进行讲解,代码如下:
#import "ViewController.h"
@interface ViewController ()<UIWebViewDelegate>
@property (strong, nonatomic) NSMutableArray *mUrlArray;//图片URL数组
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
[self loadWebView];
}
//加载WebView
-(void)loadWebView{
NSString *htmURL = @"http://finance.ifeng.com/a/20170703/15505126_0.shtml";//注意到plist中允许加载http请求
UIWebView *webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
webView.delegate = self;
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:htmURL]]];
[self.view addSubview:webView];
}
//在这个方法中捕获到图片的点击事件和被点击图片的url
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
//预览图片
if ([request.URL.scheme isEqualToString:@"image-preview"]) {
NSString* clickedImgURL = [request.URL.absoluteString substringFromIndex:[@"image-preview:" length]];
clickedImgURL = [clickedImgURL stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];//path 就是被点击图片的url
NSInteger count = 0;//计数变量
for (NSString *imgURL in _mUrlArray) {
//比对数组中的图片URL与选定图片的URL
if ([imgURL isEqualToString:clickedImgURL]) {
//第三方图片浏览器
// NSString *userid =@"1726";//用户id
// [self showPhotoBrower:_mUrlArray andIndex:count dataArray:@[] isSelf:NO authId:userid];
return NO;
}
count ++;
}
return NO;
}
return YES;
}
//webView结束加载
- (void)webViewDidFinishLoad:(UIWebView *)webView{
[self getImagesFromJSAndClickImgEvent:webView];
}
#pragma mark -- wsx 收集JS页面传来的图片及添加图片点击事件
-(void)getImagesFromJSAndClickImgEvent:(UIWebView *)webView{
//这里是JS,主要目的: - 获取H5图片的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方法
//urlResurlt - 获取到H5页面上所有图片的url的拼接
NSString *urlResurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"];
//mUrlArray就是所有图片URL的数组
_mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]];
if (_mUrlArray.count >= 2) {
[_mUrlArray removeLastObject];
}
//添加图片可点击JS
[webView 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}\
}\
}"];
[webView stringByEvaluatingJavaScriptFromString:@"registerImageClickAction();"];
}
@end