UIWebView 的 HTML5 擴充

標籤：des   style   blog   http   java   color   os   strong   

http://blog.csdn.net/duzixi/article/details/36047201

 

對於不少iOS開發人員來說，HTML5的內容比較陌生。

尤其是UIWebView類的 stringByEvaluatingJavaScriptFromString 方法

讓很多人覺得又得學一種新的語言。

而這一部分也是項目中學生常問的問題之一。

本文以Category（類目）的方式擴充了UIWebView類，將一些常用的JavaScript操作封裝成UIWebView類方法。

 

最新原始碼：https://github.com/duzixi/UIWebView-HTML5（持續維護）

 標頭檔（UIWebView+HTML5.h）

////  UIWebView+HTML5.h//  WebViewJS////  Created by 杜子兮(duzixi) on 14-6-30.//  Edited  by 杜子兮(duzixi) on 14-7-11. 修改網頁圖片顯示大小//                                       添加(jQuery)//  Copyright (c) 2014年 lanou3g.com 藍鷗. All rights reserved.//#import <UIKit/UIKit.h>@interface UIWebView (JavaScript)#pragma mark -#pragma mark 擷取網頁中的資料///  擷取某個標籤的結點個數- (int)nodeCountOfTag:(NSString *)tag;///  擷取當前頁面URL- (NSString *) getCurrentURL;///  擷取標題- (NSString *) getTitle;///  擷取圖片- (NSArray *) getImgs;///  擷取當前頁面所有連結- (NSArray *) getOnClicks;#pragma mark -#pragma mark 改變網頁樣式和行為///  改變背景顏色- (void) setBackgroundColor:(UIColor *)color;///  為所有圖片添加點擊事件(網頁中有些圖片添加無效)- (void) addClickEventOnImg;///  改變所有映像的寬度- (void) setImgWidth:(int)size;///  改變所有映像的高度- (void) setImgHeight:(int)size;///  改變指定標籤的字型顏色- (void) setFontColor:(UIColor *) color withTag:(NSString *)tagName;///  改變指定標籤的字型大小- (void) setFontSize:(int) size withTag:(NSString *)tagName;@end

 實現檔案（UIWebView+HTML5.m）：

////  UIWebView+HTML5.m////  Created by 杜子兮(duzixi) on 14-6-30.//  Edited  by 杜子兮(duzixi) on 14-7-11. 修改網頁圖片顯示大小//                                       添加(jQuery)//  Copyright (c) 2014年 lanou3g.com 藍鷗. All rights reserved.//#import "UIWebView+HTML5.h"#import "UIColor+Change.h"@implementation UIWebView (JavaScript)#pragma mark -#pragma mark 擷取網頁中的資料///  擷取某個標籤的結點個數- (int)nodeCountOfTag:(NSString *)tag{    NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName(‘%@‘).length", tag];    int len = [[self stringByEvaluatingJavaScriptFromString:jsString] intValue];    return len;}///  擷取當前頁面URL- (NSString *)getCurrentURL{    return [self stringByEvaluatingJavaScriptFromString:@"document.location.href"];}///  擷取標題- (NSString *)getTitle{    return [self stringByEvaluatingJavaScriptFromString:@"document.title"];}///  擷取所有圖片連結- (NSArray *)getImgs{    NSMutableArray *arrImgURL = [[NSMutableArray alloc] init];        for (int i = 0; i < [self nodeCountOfTag:@"img"]; i++) {        NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName(‘img‘)[%d].src", i];        [arrImgURL addObject:[self stringByEvaluatingJavaScriptFromString:jsString]];    }    return arrImgURL;}///  擷取當前頁面所有點選連結- (NSArray *)getOnClicks{    NSMutableArray *arrOnClicks = [[NSMutableArray alloc] init];        for (int i = 0; i < [self nodeCountOfTag:@"a"]; i++) {        NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName(‘a‘)[%d].getAttribute(‘onclick‘)", i];        NSString *clickString = [self stringByEvaluatingJavaScriptFromString:jsString];        NSLog(@"%@", clickString);        [arrOnClicks addObject:clickString];    }    return arrOnClicks;}#pragma mark -#pragma mark 改變網頁樣式和行為///  改變背景顏色- (void)setBackgroundColor:(UIColor *)color{    NSString * jsString = [NSString stringWithFormat:@"document.body.style.backgroundColor = ‘%@‘",[color webColorString]];    [self stringByEvaluatingJavaScriptFromString:jsString];}///  為所有圖片添加點擊事件(網頁中有些圖片添加無效,需要協議方法配合截取)- (void)addClickEventOnImg{    for (int i = 0; i < [self nodeCountOfTag:@"img"]; i++) {        //利用重新導向擷取img.src，為區分，給url添加‘img:‘首碼        NSString *jsString = [NSString stringWithFormat:            @"document.getElementsByTagName(‘img‘)[%d].onclick =               function() { document.location.href = ‘img‘ + this.src; }",i];        [self stringByEvaluatingJavaScriptFromString:jsString];    }}///  改變所有映像的寬度- (void) setImgWidth:(int)size{    for (int i = 0; i < [self nodeCountOfTag:@"img"]; i++) {        NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName(‘img‘)[%d].width = ‘%d‘", i, size];        [self stringByEvaluatingJavaScriptFromString:jsString];    }}///  改變所有映像的高度- (void) setImgHeight:(int)size{    for (int i = 0; i < [self nodeCountOfTag:@"img"]; i++) {        NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName(‘img‘)[%d].height = ‘%d‘", i, size];        [self stringByEvaluatingJavaScriptFromString:jsString];    }}///  改變指定標籤的字型顏色- (void)setFontColor:(UIColor *)color withTag:(NSString *)tagName{    NSString *jsString = [NSString stringWithFormat:        @"var nodes = document.getElementsByTagName(‘%@‘);           for(var i=0;i<nodes.length;i++){              nodes[i].style.color = ‘%@‘;}", tagName, [color webColorString]];    [self stringByEvaluatingJavaScriptFromString:jsString];}///  改變指定標籤的字型大小- (void)setFontSize:(int)size withTag:(NSString *)tagName{    NSString *jsString = [NSString stringWithFormat:        @"var nodes = document.getElementsByTagName(‘%@‘);           for(var i=0;i<nodes.length;i++){              nodes[i].style.fontSize = ‘%dpx‘;}", tagName, size];    [self stringByEvaluatingJavaScriptFromString:jsString];}@end

 原文出處：http://blog.csdn.net/duzixi/article/details/36047201