UIWebView/JS

一: 什么是UIWebView

UIWebView是iOS內置的瀏覽器控件
系統自帶的Safari瀏覽器就是通過UIWebView實現的

UIWebView不但能加載遠程的網頁資源,還能加載絕大部分的常見文件例如:

html\htm、pdf、doc、ppt、txt、mp4… …

01 webView是有缺點的,會導致內存泄露,而且這個問題是它系統本身的問題。
02 手機上面的safai其實就是用webView來實現的
03 現在的開發并不完全是原生的開發,而更加傾向于原生+Html5的方式
04 webView是OC代碼和html代碼之間進行交互的橋梁

  • UIWebView常用的加載資源的方法
- (void)loadRequest:(NSURLRequest
*)request;
Paste_Image.png

二: 常用屬性和方法

重新加載(刷新)
- (void)reload;  

停止加載
- (void)stopLoading;   

回退
- (void)goBack; 

前進
- (void)goForward;  

是否能回退
@property(nonatomic) UIDataDetectorTypes dataDetectorTypes   

是否能回退
@property(nonatomic,readonly,getter=canGoBack) BOOL canGoBack;  

 是否能前進
@property(nonatomic,readonly,getter=canGoForward) BOOL canGoForward;   

是否正在加載中
@property(nonatomic,readonly,getter=isLoading) BOOL loading;

是否伸縮內容至適應屏幕當前尺寸
@property(nonatomic) BOOL scalesPageToFit;

三: 監聽UIWebView的加載過程

成為UIWebView的代理,遵守UIWebViewDelegate協議,就能監聽UIWebView的加載過程

開始發送請求(加載數據)時調用這個方法
-(void)webViewDidStartLoad:(UIWebView *)webView;

請求完畢(加載數據完畢)時調用這個方法
-(void)webViewDidFinishLoad:(UIWebView *)webView;

請求錯誤時調用這個方法
- (void)webView:(UIWebView
*)webView didFailLoadWithError:(NSError
*)error;

UIWebView在發送請求之前,都會調用這個方法,如果返回NO,代表停止加載請求,返回YES,代表允許加載請求

- (BOOL)webView:(UIWebView
*)webView shouldStartLoadWithRequest:(NSURLRequest
*)request navigationType:(UIWebViewNavigationType)navigationType;

四: 什么是JavaScript

JavaScript是一門腳本語言,簡稱JS

JS的常見作用有: 給HTML網頁添加動態功能,比如響應用戶的各種操作, 操縱HTML元素,比如添加、刪除、修改網頁元素

  • 常見的JavaScript函數

alert(10); 彈框

document.getElementById(‘test’); 根據ID獲得某個DOM元素

五: OC中調用JavaScipt

如何在OC中調用JavaScript代碼
使用UIWebViewstringByEvaluatingJavaScriptFromString方法即可

六: 代碼相關

#######6.1 網頁操控相關方法

[self.webView goBack];      回退
[self.webView goForward];   前進
[self.webView reload];      刷新

#######6.2 設置是否能夠前進和回退

self.goBackBtn.enabled = webView.canGoBack;
self.fowardBtn.enabled = webView.canGoForward;

#######6.3 常用的屬性設置

  • 設置網頁自動適應
self.webView.scalesPageToFit = YES; 
  • 設置檢測網頁中的格式類型,all表示檢測所有類型包括超鏈接、電話號碼、地址等。
self.webView.dataDetectorTypes = UIDataDetectorTypeAll; 
  • 可滾動范圍
self.webView.scrollView.contentInset = UIEdgeInsetsMake(50, 0, 0, 0);

#######6.4 相關代理方法

  • 每當將加載請求的時候調用該方法,返回YES 表示加載該請求,返回NO 表示不加載該請求, 可以在該方法中攔截請求.
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    return ![request.URL.absoluteString containsString:@"dushu"];
}
  • 開始加載網頁,不僅監聽我們指定的請求,還會監聽內部發送的請求
-(void)webViewDidStartLoad:(UIWebView *)webView
  • 網頁加載完畢之后會調用該方法
-(void)webViewDidFinishLoad:(UIWebView *)webView
  • 網頁加載失敗調用該方法
-(void)webView:(UIWebView *)webView didFailLoadWithError:(NSError *)error

#######6.5 加載本地資源

NSURL *url = [[NSBundle mainBundle] URLForResource:@"text.html" withExtension:nil];
[self.webView loadRequest:[NSURLRequest requestWithURL:url]];

七: HTML/CSS/JS

  • 1.Html決定網頁的內容,css決定網頁的樣式,js決定網頁的事件
  • 2.html學習網站:http://www.w3school.com.cn

八: OC和JS代碼的互調

#######8.1 OC調用JS的代碼

NSString *str = [self.webView stringByEvaluatingJavaScriptFromString:@"sum()"];

#######8.2 JS怎么調用OC的說明

  • 1, 新的需求:點擊按鈕的時候撥打電話
    但是我在點擊按鈕的時候,用戶是不知道的,我們怎么能夠知道用戶點擊了網頁上面的一個按鈕,只能通過一個技巧,那就是自己搞一個特定的協議頭比如說zxz:當我攔截到你的網絡請求的時候,只需要判斷一下當前的協議頭是不是這個就能判斷你現在是否是JS調用。

  • 2, OC里面有通過字符串生成SEL類型的方法,所以當拿到數據之后做下面的事情
    1)截取方法的名稱
    2)將截取出來的字符串轉換為SEL
    3)利用performSelect方法來調用SEL

  • 3, 涉及到的相關方法

判斷字符串是否以一個固定的字符開頭,這里為A
[@"abc"hasPrefix:@"A"] 

截串操作
- (NSString
*)substringFromIndex:(NSUInteger)from;

切割字符串,返回一個數組
- (NSArray<NSString
*> *)componentsSeparatedByString:(NSString *)separator;

替換操作
- (NSString
*)stringByReplacingOccurrencesOfString:(NSString *)target withString:(NSString
*)replacement

把string包裝成SEL
SEL selector = NSSelectorFromString(sel);

#######8.3 如何屏蔽警告

#pragma clang diagnostic push
#pragma clang diagnostic ignored "-Warc-performSelector-leaks"
-Warc-performSelector-leaks為唯一的警告標識,這里面的代碼可以去除警告
[self performSelector:selector withObject:nil];
#pragma clang diagnostic pop
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • UIWebView 什么是UIWebView UIWebView是iOS內置的瀏覽器控件 系統自帶的Safari瀏...
    JonesCxy閱讀 704評論 0 1
  • 一、簡介 近兩年隨著HTML5的迅速發展與日趨成熟,越來越多的移動開發者選擇使用HTML5來進行混合開發,不僅節約...
    RainyGY閱讀 1,909評論 1 12
  • 一、簡介 近兩年隨著HTML5的迅速發展與日趨成熟,越來越多的移動開發者選擇使用HTML5來進行混合開發,不...
    寶寶teacher閱讀 2,372評論 3 15
  • http://www.cnblogs.com/mddblog/p/5281748.html 一、整體介紹 UIWe...
    F麥子閱讀 1,264評論 0 2
  • 前言 關于UIWebView的介紹,相信看過上文的小伙伴們,已經大概清楚了吧,如果有問題,歡迎提問。 本文是本系列...
    CoderLF閱讀 9,022評論 2 12