[Swift通天遁地]1、超級工具-(5)使用UIWebView(網頁視圖)加載本地頁面並調用JavaScript(腳本)代碼

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★
➤微信公衆號:山青詠芝(shanqingyongzhi)
➤博客園地址:山青詠芝(https://www.cnblogs.com/strengthen/
➤GitHub地址:https://github.com/strengthen/LeetCode
➤原文地址:http://www.javashuo.com/article/p-uqzmbhyk-er.html 
➤若是連接不是山青詠芝的博客園地址,則多是爬取做者的文章。
➤原文已修改更新!強烈建議點擊原文地址閱讀!支持做者!支持原創!
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★php

目錄:[Swift]通天遁地Swifthtml

本文將演示如何使用UIWebView(網頁視圖)讀取項目中的網頁文件,以及執行JavaScript腳本代碼。git

在項目文件夾【DemoApp】上點擊鼠標右鍵,彈出右鍵菜單。github

【New File】->【Blank】空白模板->【next】web

->【Save As】:Register.html->【Create】swift

在Register.html中輸入網頁代碼:微信

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 5     <title>Registration</title>
 6     <script>
 7         function submitForm()
 8         {
 9             //得到用戶名的文本框的值
10             var userName = document.getElementById('userName').value
11             //經過彈出警告窗口的方式,顯示文本框的內容
12             alert("The value of user name is : "+userName);
13         }
14     </script>
15 </head>
16 <body>
17     <form id="registerForm" action="form_action.php" onsubmit="submitForm()">
18         UserName: <input type="text" id="userName" name="userName"/><br/>
19         Password: <input type="password" id="password" name="password"/><br/>
20         <input type="submit" value="Submit"/>
21     </form>
22 </body>
23 </html>

在項目導航區,打開視圖控制器的代碼文件【ViewController.swift】ide

經過UIWebView(網頁視圖)加載上文建立的網頁文件,並調用腳本函數。函數

 1 import UIKit
 2 
 3 class ViewController: UIViewController {
 4     
 5     //添加一個網頁視圖對象,做爲當前類的屬性
 6     var webView:UIWebView!
 7     
 8     override func viewDidLoad() {
 9         super.viewDidLoad()
10         
11         //得到當前設備的屏幕尺寸信息
12         let bounds = UIScreen.main.bounds
13         //經過屏幕尺寸信息建立一個矩形的顯示區域
14         let frame = CGRect(x: 0, y: 40, width: bounds.width, height: bounds.height)
15         
16         //初始化一個網頁視圖對象,並以矩形區域做爲其顯示區域
17         webView = UIWebView(frame: frame)
18         //設置網頁視圖的背景顏色爲橙色
19         webView.backgroundColor = UIColor.orange
20         //將網頁視圖添加到當前視圖控制器的根視圖
21         self.view.addSubview(webView)
22         
23         //得到網頁文件在項目中的路徑
24         let path = Bundle.main.path(forResource: "Register", ofType: "html")
25         //並將路徑轉換成網址的樣式
26         let url = URL(string: path!)
27         //經過網頁視圖的加載請求方法,加載該網址路徑下的網頁文件
28         webView.loadRequest(NSURLRequest(url: url!) as URLRequest)
29         
30         //添加一個按鈕控件,當按鈕被點擊時,將得到並打印網頁的屬性信息
31         let getInfo = UIButton(frame: CGRect(x: 40, y: 400, width: 240, height: 44))
32         //設置按鈕在正常狀態下的標題文字
33         getInfo.setTitle("Get the information", for: UIControlState.init(rawValue: 0))
34         //設置按鈕的背景顏色爲橙色
35         getInfo.backgroundColor = UIColor.orange
36         //給按鈕綁定點擊事件
37         getInfo.addTarget(self, action: #selector(ViewController.getInfo), for: .touchUpInside)
38         
39         //添加第二個按鈕事件,當按鈕被點擊時,將設置網頁表單的內容,並提交該表單
40         let submitForm = UIButton(frame: CGRect(x: 40, y: 470, width: 240, height: 44))
41         //設置按鈕在正常狀態下的標題文字
42         submitForm.setTitle("Set and submit form", for: UIControlState.init(rawValue: 0))
43         //設置按鈕的背景顏色爲橙色
44         submitForm.backgroundColor = UIColor.orange
45         //給按鈕綁定點擊事件
46         submitForm.addTarget(self, action: #selector(ViewController.submitForm), for: .touchUpInside)
47         
48         //設置根視圖的背景顏色
49         self.view.backgroundColor = UIColor.orange
50         //將兩個按鈕依次添加到當前視圖控制器的根視圖
51         self.view.addSubview(getInfo)
52         self.view.addSubview(submitForm)
53     }
54     
55     //添加一個方法,用來得到並打印網頁的屬性信息
56     func getInfo()
57     {
58         //經過網頁視圖的執行腳本命令,執行腳本代碼,此腳本代碼用來得到網頁所對應的網址字符串
59         let url = webView.stringByEvaluatingJavaScript(from: "document.location.href")
60         //執行第二句腳本代碼,此腳本代碼用來得到網頁的標題信息
61         let title = webView.stringByEvaluatingJavaScript(from: "document.title")
62         //將得到的相關信息拼接成一個字符串
63         let info = url! + "\n" + title!
64         //在控制檯打印輸出
65         print(info)
66     }
67     
68     //添加一個方法,用來設置網頁表單的內容,並提交該表單
69     func submitForm()
70     {
71         //初始化一個字符串常量,表示一個腳本語句,
72         //該腳本語句用來設置用戶名文本框的值。
73         let firstJs = "document.getElementById('userName').value = 'Jerry'"
74         //初始化另外一個字符串常量,表示一個腳本語句
75         //該腳本語句用來執行指定名稱的函數
76         let secondJs = "submitForm()"
77         //經過網頁視圖的執行腳本命令,
78         //依次執行這兩條腳本語句。
79         webView.stringByEvaluatingJavaScript(from: firstJs)
80         webView.stringByEvaluatingJavaScript(from: secondJs)
81     }
82     
83     override func didReceiveMemoryWarning() {
84         super.didReceiveMemoryWarning()
85         // Dispose of any resources that can be recreated.
86     }
87 }
相關文章
相關標籤/搜索