HTML5教程-HTML5基本概念-李南江

配套視頻下載地址

---

什麼是瀏覽器

-  瀏覽器是安裝在電腦裏面的一個軟件， 能夠讓將網頁內容呈現給用戶查看，並讓用戶與網頁交互的一種軟件。 就好比QQ一樣都是安裝在電腦裏面的一個軟件， 只不過功能不同而已
- 常見主流瀏覽器

>- 瀏覽器市場份額-國內統計
>- 瀏覽器市場份額-國外統計
- 不同的瀏覽器有不同的瀏覽器內核， 瀏覽器內核也就是瀏覽器所採用的渲染引擎，渲染引擎決定了瀏覽器如何顯示網頁的內容，從而導致了瀏覽器兼容性問題出現
 - IE內核 Trident
 - 谷歌內核 WebKit / Blink
 - 火狐內核 Gecko
 - Safarri內核 WebKit
 - 歐朋內核 Presto
- 前期上課以後面谷歌瀏覽器爲主，後面將專門詳細介紹瀏覽器兼容問題

什麼是服務器

- 服務器也是電腦，只不過是比我們的電腦配置更高的電腦，並且24小時不斷電，不關機的計算機
- 服務器是專門用於存儲數據電腦， 訪問者可以訪問服務器獲得服務器上存儲的資源
- 服務器一旦關機，訪問者就無法訪問

---

訪問網頁原理

瀏覽器請求數據的原理

• 我們是如何通過瀏覽器查看網頁上的內容的？

• 1.打開IE緩存文件夾

  + `C:\Users\Jonathan_Lee\AppData\Local\Microsoft\Windows\Temporary Internet Files`

  • Jonathan_Lee爲個人電腦用戶名名稱

• 2.清空該文件夾
  

  
  

• 3.用IE打開網頁
  

  
  

• 4.發現文件夾下多了很多文件（.html、.css、.js、.png等）， 仔細觀察不難發現其實這些文件都是被訪問網頁上的內容

• 5.結論

  • 訪問網頁時是有真實的、物理的文件傳輸的

  • 網頁不是一個文件，而是一堆文件組成的

  • 我們之所以平常感覺第二次訪問比第一次訪問快的原因就是，第一次訪問時已經將所有文件緩存到了本地

瀏覽器請求數據的過程

• 1.按下回車時瀏覽器根據輸入的URL地址發送請求報文

• 2.服務器接收到請求報文，會對請求報文進行處理

• 3.服務器將處理完的結果通過響應報文返回給瀏覽器

• 4.瀏覽器解析服務器返回的結果，將結果顯示出來
  

  
  

• 請求過程驗證

  • 3.1請求報文

  • 一個HTTP請求報文由請求行（request line）、請求頭部（header）、空行和請求數據4個部分
    

    
    

  • 3.2響應報文

  • 一個HTTP響應報文由響應行、響應頭、響應體組成
    

    
    

    
    

    
    

  • 1.利用chome瀏覽器打開一個網頁

  • 2.打開開發人員工具

  • 3.打開Network查看請求報文和響應報文

---

什麼是URL

• 1.我們在瀏覽器的地址欄中輸入的地址其實就是URL

• 2.URL格式：

  • 127.0.0.1/index.html （瀏覽器會自動補全http:和：80）

  • http://127.0.0.1/index.html  （瀏覽器會自動補全：80）

  • http://127.0.0.1:80/index.html （完整格式）

  • 協議類型://ip地址:端口號/資源路徑/資源名稱

• 3.URL拆分

  • 網絡協議類型 http://

  • 服務器IP地址 127.0.0.1

  • 服務器端口號 :80

  • 資源路徑 網頁在服務器上的路徑

  • 資源名稱 index.html

• 4.URL拆分後每一部分的作用

• 4.1服務器IP地址 和 服務器端口號它們兩的作用：

  • 告訴瀏覽器要去什麼地方纔能找到對應的服務器， 也就是告訴瀏覽器服務器的詳細地址

  • 服務器IP地址相當於現實生活中的地址； 例如：廣州市天河區棠安苑

  • 服務器端口號相當於現實生活中的門牌號碼； 例如： 9棟909室

  • 那麼如果將地址和門牌號碼結合在一起， 就是我的詳細地址
    

    
    

• 4.2資源名稱它的作用：

  • 告訴服務器我需要獲取哪一個文件

• 4.3資源名稱

  • 需要訪問的文件名稱

• 5.補充

  • URL全稱Uniform Resource Locator(統一資源定位符)， 互聯網上的每一個資源都有一個唯一的URL地址

  • 由於IP地址全都是數字， 沒有任何的含義，比較難以記憶。 所以在訪問網頁時最常見的不是IP地址而是“域名”（一串有含義的字母OR數字）

  • 好比： http://www.baidu.com AND  http://111.13.100.92:80/

什麼是HTTP協議

• 1.HTTP是Hypertext Transfer Protocol的縮寫, 超文本傳輸協議

• 2.什麼是協議?

  • 在現實生活中有很多的協議, 例如租房協議/買賣協議/離婚協議

  • 無論是什麼協議他們都是一個共同點, 就是用來規範/約束某一類事物

• 3.溝通問題?

  • 溝通最常見的問題就是語言不通, 例如中國人和美國人溝通, 一個人說中文, 一個人說英文, 如果兩個人都不懂中文或者英文, 那麼就會出現溝通問題

  • 如果要想解決溝通文件, 是不是需要先擬定規定, 兩個人都說中文, 或者兩個人都說英文, 或者請一個既懂中文又懂英文的翻譯

• 4.HTTP協議是用來規範/約束哪一類事物?

  • 瀏覽器訪問網頁其實就是去服務器請求數據, 所以瀏覽器需要和服務器溝通, 所以也會存在溝通問題

  • HTTP協議就相當於我們讓兩個人都說中文或者都說英文一樣, 就是提前規範兩個人之間如何溝通, 也就是規範/約束瀏覽器和服務器之間如何溝通

其它知識儲備

• 在Windows系統中如何查看文件的擴展名

  • 默認情況下Windows系統是不顯示文件的擴展名的, 但是作爲一個開發者而言, 查看文件的擴展名是我們的必備技能

  • win10:  隨便打開一個文件夾-->點擊查看-->將文件擴展名的選項勾選上
    

    
    

• 電腦上的一個文件是可以"同時"被多個軟件打開的, 不同的軟件打開可能會有不同的效果

  • 例如: 同一個index.html文件可以被多個瀏覽器和記事本一起打開

  • 例如: .html文件通過瀏覽器打開不可以編輯, 通過記事本打開可以編輯

• 什麼是純文本文件?

  • 我們Windows電腦上有一款默認安裝好的軟件叫做記事本. 這款軟件就是專門用來打開純文本文件的, 所以只要能夠被記事本打開, 並且能夠正常顯示的文件都是純文本文件

  • .html的文件可以被記事本打開, 並且能夠正常顯示,所以.html文件是一個純文本文件