WebView的幾種使用方法:
首先:配置Plist文件 可以進(jìn)行網(wǎng)絡(luò)請(qǐng)求
或者:Source Code寫入HTML格式
否則:你懂得~~??
使用StoryBoard拖3個(gè)WebView寄雀,平分了整個(gè)屏幕:
再把背景色設(shè)置為紫色诲宇。
三個(gè)WebView:
@property (strong, nonatomic) IBOutlet UIWebView *webV_1;
@property (strong, nonatomic) IBOutlet UIWebView *webV_2;
@property (strong, nonatomic) IBOutlet UIWebView *webV_3;
獲取本地文件內(nèi)容(HTML文件)
在“MyCreateFile.html”本地文件勉耀,編輯HTML格式的內(nèi)容:
<html>
<meta charset="UTF-8">
<head lang="en">
<meta charset="UTF-8">
<h1 style='color:blue'>
What's The Fox say疹蛉?
</h1>
</head>
<br> </br>
<body>
<h1>What's The Fox say辉阶?</h1> <!-- 一級(jí)標(biāo)題 -->
<h2>我的HTML標(biāo)題Lev2</h2>
<h3>我的HTML標(biāo)題Lev3</h3>
<h4>我的HTML標(biāo)題Lev4</h4>
<h5>我的HTML標(biāo)題Lev5</h5>
<h6>我的HTML標(biāo)題Lev6</h6> <!-- 六級(jí)標(biāo)題 -->
<p>
<p style='color:red'> <!-- 顏色改變 -->
老子的HTML學(xué)習(xí)第一次
</p>
<p>
勞資的HTML學(xué)習(xí)第一次 What's The Fox says
勞資HTML學(xué)習(xí)第一次 勞資HTML學(xué)習(xí)第一次
勞資HTML學(xué)習(xí)第一次勞資HTML學(xué)習(xí)第一次
</p>
<input type="button" value="按鈕">
<input type = "color"> <br/> <!-- <br/>:自動(dòng)換行 -->
<!-- <br />=<br>...</br> -->
<input type = "text" placeholder="請(qǐng)輸入賬號(hào)"> <br/>
<a >百度一下创倔,你就上當(dāng)
</a>
<form>
<input type='checkbox' name='sex' value='male' selected=selected>程序員
<input type='checkbox' name='sex' value='male' selected=selected>老板 <br/> <!-- checkbox:多選框 -->
<input type='radio' name='sex' value='male' selected=selected>男人
<input type='radio' name='sex' value='female'>女人 <!-- radio:單選框 -->
</form>
</body>
</html>
[self loadLocalHtml];
-(void)loadLocalHtml
{
//1.從本地獲取HTML文件
NSString * path = [[NSBundle mainBundle] pathForResource:@"MyCreateFile" ofType:@"html"];
//2.從文件中獲取HTML字符串
NSString * htmlStr = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
//3.加載在webview中
[self.webV_1 loadHTMLString:htmlStr baseURL:nil];
//4.可以 加載在Label的??富文本??中 (但是只能觀看~??????)
//NSData * data = [htmlStr dataUsingEncoding:NSUTF8StringEncoding]; //Label的字體 大小 并不能影響 html字體的大小
//NSAttributedString * str = [[NSAttributedString alloc] initWithData:data options:@{NSDocumentTypeDocumentAttribute:NSHTMLTextDocumentType} documentAttributes:nil error:nil];
//self.htmlLB.attributedText = str;
}
[self.webV_1 loadHTMLString:htmlStr baseURL:nil];
對(duì)于“[ loadHTMLString: baseURL: ]”方法,可以替換為:
NSURL * webURL = [NSURL fileURLWithPath:path]; //通過文件路徑字符串獲取URL
NSURLRequest * URLRequest = [NSURLRequest requestWithURL:webURL];//設(shè)置請(qǐng)求 提交的相關(guān)URL
[self.webV_1 loadRequest:URLRequest]; //提交請(qǐng)求
好處:URL(統(tǒng)一資源定位符~~)不但可以獲取本地文件內(nèi)容琢歇,也可以加載網(wǎng)絡(luò)信息。
當(dāng)然“[ loadHTMLString: baseURL: ]”方法可以加載HTML格式或CSS格式的網(wǎng)絡(luò)信息梦鉴! 之前自己只是將網(wǎng)絡(luò)上請(qǐng)求的信息(CSS格式)加載出來了而已李茫!
網(wǎng)上說法:??baseURL如果是一個(gè)網(wǎng)絡(luò)路徑,就能加載 網(wǎng)絡(luò)上的CSS信息了肥橙!??但是自己還沒試過魄宏。。存筏。宠互。味榛。
希望明白的朋友指點(diǎn)一下~ !
蘋果官方 不推薦用來加載網(wǎng)絡(luò)信息:(?? 當(dāng)然有時(shí)候 官方就是屁~)
總結(jié):
1.“<head></head>”部分 只有一個(gè)藍(lán)色標(biāo)題予跌。
2.“<br><br/>”效果與“<br/> ”相同 (換行操作)搏色。
3.“程序員”、“老板” 為多選項(xiàng)券册;“男人”频轿、“女人” 為單選項(xiàng)。
4.點(diǎn)擊“百度一下烁焙,你就上當(dāng)”航邢,進(jìn)入百度網(wǎng)頁(yè)。
※5.WebView的背景色跟UIScrollView一樣(包含了一個(gè)UIScrollView屬性)骄蝇,藍(lán)色會(huì)被內(nèi)容視圖遮擋膳殷。
從服務(wù)器加載 HTML頁(yè)面
[self loadInternetHtml];
//從服務(wù)器加載HTML頁(yè)面
-(void)loadInternetHtml
{
//加載服務(wù)器HTML頁(yè)面的 模式
// NSString *urlStr = [NSString stringWithFormat:@"%@/appservice/getAnnouncementDetail.do?id=%@",O2O_URL,self.idStr];
NSString *urlStr = @"https://www.baidu.com";
NSURL *url = [NSURL URLWithString:urlStr];
NSLog(@"url:%@",url);
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[self.webV_1 loadRequest:request];
}
使用WebView的delegate方法:
@interface ViewController () <UIWebViewDelegate> // 設(shè)置代理
[self useWebViewDelegate];
-(void)useWebViewDelegate
{
self.webV_2.delegate = self; // ??設(shè)置代理
self.webV_2.scrollView.bounces = NO;//禁止WebView的彈簧效果
NSString *urlStr = @"https://www.baidu.com";
NSURL *url = [NSURL URLWithString:urlStr];
NSLog(@"url:%@",url);
NSURLRequest * request = [NSURLRequest requestWithURL:url];
[self.webV_2 loadRequest:request];
}
#pragma mark - UIWebView Delegate
- (void)webViewDidStartLoad:(UIWebView *)webView
{ 開始加載時(shí)調(diào)用的方法
}
- (void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error
{加載失敗時(shí)調(diào)用的方法
}
// 禁止webview中的鏈接點(diǎn)擊 (用于 :??過濾 請(qǐng)求條件)
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType
{ // 頁(yè)面準(zhǔn)備加載內(nèi)容時(shí)調(diào)用,通過返回值來進(jìn)行判斷是否要加載
if (webView == self.webV_2) { // 是第二個(gè)WebView
if(navigationType == UIWebViewNavigationTypeLinkClicked)
{ //判斷點(diǎn)擊的是否為 鏈接
return NO; //返回“NO”九火,不加載到鏈接的頁(yè)面
}else{
return YES;
}
} else { // 其他WebView可以響應(yīng) 鏈接
return YES;
}
}
加載效果:
第二個(gè)WebView每次點(diǎn)擊到響應(yīng)的類型秽之,都會(huì)判斷是否為“鏈接”類型:如果是,不予響應(yīng)(進(jìn)入鏈接頁(yè)面)吃既。如果點(diǎn)擊的 是鏈接類型考榨,不予響應(yīng)
-(void)webViewDidFinishLoad:(UIWebView *)webView
{ // 加載完后觸發(fā)
if (webView == self.webV_2) { // 是第二個(gè)WebView
NSString * fontStr = @"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '50%'";//字體大小
// ………………
[self.webV_2 stringByEvaluatingJavaScriptFromString:fontStr];
}
}
加載效果:
第二個(gè)WebView的字體,縮小為原來的50%
JavaScript方式鹦倚,操作web數(shù)據(jù)
需要等UIWebView中的頁(yè)面加載完成之后去調(diào)用河质。
“ - (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;”方法向UIWebView傳遞一段需要執(zhí)行的JavaScript代碼,最后獲取執(zhí)行結(jié)果震叙。
在 - (void)viewDidLoad { }里面:
[self useJavaScriptWay];
-(void)useJavaScriptWay {
self.webV_3.delegate = self; //設(shè)置代理
NSURL *url =[[NSURL alloc] initWithString:@"https://www.baidu.com"];
NSURLRequest *request = [[NSURLRequest alloc] initWithURL:url];
[self.webV_3 loadRequest:request];
}
在頁(yè)面加載完成后掀鹅,去調(diào)用WebView的“stringByEvaluatingJavaScriptFromString”方法:
-(void)webViewDidFinishLoad:(UIWebView *)webView
{ // 加載完后觸發(fā)
if (webView == self.webV_3) {
[self changeValueForUsingJavaScriptWay];
}
}
-(void)changeValueForUsingJavaScriptWay {
// 獲取當(dāng)前頁(yè)面的URL
NSString *currentURL = [self.webV_3 stringByEvaluatingJavaScriptFromString:@"document.location.href"];
//獲取當(dāng)前頁(yè)面的標(biāo)題名稱
NSString *title = [self.webV_3 stringByEvaluatingJavaScriptFromString:@"document.title"];
NSLog(@"%URL:@====title:%@",currentURL,title);
// ??交互格式??
//[self.webV_3 stringByEvaluatingJavaScriptFromString:@"方法名(%@)",參數(shù)] ];
//插入js代碼
//[self.webV_3 stringByEvaluatingJavaScriptFromString:@"var script = document.createElement('script');"
//"script.type = 'text/javascript';"
//"script.text = \"function myFunction() { "
//"var field = document.getElementsByName('q')[0];"
//"field.value='goyoholBest.com';"
//"document.forms[0].submit();"
//"}\";"
//"document.getElementsByTagName('head')[0].appendChild(script);"];
//給網(wǎng)頁(yè)增加utf-8編碼
//[self.webV_3 stringByEvaluatingJavaScriptFromString:
//@"var tagHead =document.documentElement.firstChild;"
//"var tagMeta = document.createElement(\"meta\");"
//"tagMeta.setAttribute(\"http-equiv\", \"Content-Type\");"
//"tagMeta.setAttribute(\"content\", \"text/html; charset=utf-8\");"
//"var tagHeadAdd = tagHead.appendChild(tagMeta);"];
//給網(wǎng)頁(yè)增加css樣式
//[self.webV_3 stringByEvaluatingJavaScriptFromString:
//@"var tagHead =document.documentElement.firstChild;"
//"var tagStyle = document.createElement(\"style\");"
//"tagStyle.setAttribute(\"type\", \"text/css\");"
//"tagStyle.appendChild(document.createTextNode(\"BODY{padding: 20pt 15pt}\"));"
//"var tagHeadAdd = tagHead.appendChild(tagStyle);"];
//攔截網(wǎng)頁(yè)圖片 并修改圖片大小
[self.webV_3 stringByEvaluatingJavaScriptFromString:
@"var script = document.createElement('script');"
"script.type = 'text/javascript';"
"script.text = \"function ResizeImages() { "
"var myimg,oldwidth;"
"var maxwidth=50;" //縮放系數(shù)
"for(i=0;i <document.images.length;i++){"
"myimg = document.images[i];"
"if(myimg.width > maxwidth){"
"oldwidth = myimg.width;"
"myimg.width = maxwidth;"
"myimg.height = myimg.height * (maxwidth/oldwidth);"
"}"
"}"
"}\";"
"document.getElementsByTagName('head')[0].appendChild(script);"];
[self.webV_3 stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];
}
加載的效果:圖片被縮小 及 進(jìn)入一個(gè)頁(yè)面打印其URL及title信息
2016-12-26 01:39:52.008 WebViewUse-Demo[3221:164983] https://www.baidu.com/====百度一下
2016-12-26 01:39:58.571 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
2016-12-26 01:39:59.196 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
2016-12-26 01:40:11.736 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fdsp%253Dwise%2526nid%253D3267967319825678069%2526n_type%253D1%2526p_from%253D3%2522%257D%257D====百度一下
2016-12-26 01:40:12.039 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fdsp%253Dwise%2526nid%253D3267967319825678069%2526n_type%253D1%2526p_from%253D3%2522%257D%257D====百度一下
2016-12-26 01:41:11.831 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
2016-12-26 01:41:12.409 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
2016-12-26 01:41:13.252 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
2016-12-26 01:41:13.599 WebViewUse-Demo[3221:164983] https://www.baidu.com/#iact=wiseindex%2Ftabs%2Fnews%2Factivity%2Fnewsdetail%3D%257B%2522linkData%2522%253A%257B%2522name%2522%253A%2522iframe%252Fmib-iframe%2522%252C%2522id%2522%253A%2522feed%2522%252C%2522index%2522%253A0%252C%2522url%2522%253A%2522https%253A%252F%252Fm.baidu.com%252Ffeed%252Fdata%252Flandingpage%253Fnid%253D3286129817483816749%2526n_type%253D1%2526p_from%253D2%2522%252C%2522title%2522%253A%2522%25E7%2588%25B1%25E7%25BE%258E%25E5%25B0%25B1%25E8%25A6%2581%25E7%2598%25A6%25E7%2598%25A6%25E7%2598%25A6%2522%257D%257D====百度一下
我現(xiàn)在看到“百度”,就??????
Tips:
使用較少的方法媒楼,也更自由:
- (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;
其中:data是文件數(shù)據(jù)乐尊,MIMEType是文件類型,textEncodingName是編碼類型划址,baseURL是素材資源路徑扔嵌。
屬性和變量:
@property (nonatomic,readonly,retain)UIScrollView *scrollView; // 內(nèi)置的scrollView
@property (nonatomic,readonly,retain)NSURLRequest *request; // URL請(qǐng)求
@property (nonatomic,readonly,getter=canGoBack)BOOL canGoBack; // 獲取能否返回上一級(jí)
@property (nonatomic,readonly,getter=canGoForward)BOOL canGoForward; // 獲取能否跳轉(zhuǎn)下一級(jí)
@property (nonatomic,readonly,getter=isLoading)BOOL loading; // 獲取是否 正在加載數(shù)據(jù)
@property (nonatomic)UIDataDetectorTypes dataDetectorTypesNS_AVAILABLE_IOS(3_0); // 設(shè)置某些數(shù)據(jù)變?yōu)殒溄有问剑@個(gè)枚舉可以設(shè)置如電話號(hào)夺颤,地址痢缎,郵箱等轉(zhuǎn)化為鏈接
@property (nonatomic)BOOL allowsInlineMediaPlaybackNS_AVAILABLE_IOS(4_0); // 設(shè)置是否使用內(nèi)聯(lián)播放器播放視頻
@property (nonatomic)BOOL mediaPlaybackRequiresUserActionNS_AVAILABLE_IOS(4_0); // 設(shè)置視頻是否自動(dòng)播放
@property (nonatomic)BOOL mediaPlaybackAllowsAirPlayNS_AVAILABLE_IOS(5_0); // 設(shè)置音頻播放是否支持AirPlay功能
@property (nonatomic)BOOL suppressesIncrementalRenderingNS_AVAILABLE_IOS(6_0); // 設(shè)置是否將數(shù)據(jù)加載如內(nèi)存后渲染界面
@property (nonatomic)BOOL keyboardDisplayRequiresUserActionNS_AVAILABLE_IOS(6_0); // 設(shè)置用戶交互模式
@property (nonatomic)UIWebPaginationMode paginationModeNS_AVAILABLE_IOS(7_0);
此屬性是用來設(shè)置一種模式,當(dāng)網(wǎng)頁(yè)大小超出view時(shí)世澜,可將網(wǎng)頁(yè)設(shè)置成以“翻頁(yè)”的效果展示独旷,枚舉如下:
typedef NS_ENUM(NSInteger, UIWebPaginationMode) {
UIWebPaginationModeUnpaginated, // 不使用翻頁(yè)效果
UIWebPaginationModeLeftToRight, // 將網(wǎng)頁(yè)超出部分分頁(yè),從左向右進(jìn)行翻頁(yè)
UIWebPaginationModeTopToBottom, // 將網(wǎng)頁(yè)超出部分分頁(yè),從上向下進(jìn)行翻頁(yè)
UIWebPaginationModeBottomToTop, // 將網(wǎng)頁(yè)超出部分分頁(yè)嵌洼,從下向上進(jìn)行翻頁(yè)
UIWebPaginationModeRightToLeft // 將網(wǎng)頁(yè)超出部分分頁(yè)案疲,從右向左進(jìn)行翻頁(yè)
};
@property (nonatomic)CGFloat pageLengthNS_AVAILABLE_IOS(7_0); // 設(shè)置每一頁(yè)的長(zhǎng)度
@property (nonatomic)CGFloat gapBetweenPagesNS_AVAILABLE_IOS(7_0); // 設(shè)置每一頁(yè)的間距
@property (nonatomic,readonly)NSUInteger pageCountNS_AVAILABLE_IOS(7_0); // 獲取分頁(yè)數(shù)
- (void)reload; // 重新加載數(shù)據(jù)
- (void)stopLoading; // 停止加載數(shù)據(jù)
- (void)goBack; // 返回上一級(jí)
- (void)goForward; // 跳轉(zhuǎn)下一級(jí)
暫時(shí)就說這么多吧!麻养!之后還會(huì)寫一篇JS交互的文章~
也不知道什么時(shí)候了~~ 褐啡?哈哈????