從html到JavaScript網站建設時應理清的三個層次

2022-05-18 分類：網站建設

普通用戶看到的網站，實際上包含了前端表現頁面，和后端管理系統。諸如網站的設計、人機交互以及頁面內容呈現等，都屬于前端頁面部分。而網站內容管理則屬于后端，后端系統除去網站管理人員外，一般用戶無法瀏覽接觸，它包含了CMS系統和存放網站內容的數據庫等。要系統討論網站建設和網站制作知識，自然是一件復雜且耗時的事情，所以本文嘗試從前端頁面談起，從html到JavaScript網站建設時應理清的三個層次談起。那些在網站建設行業工作的人，把網站前端網站開發比作三條腿的凳子，其分別是網站開發的三個層次：包含了結構、樣式和行為。

為什么要分隔這些層？

當您創建網頁時，其結構應歸屬于HTML，視覺樣式應歸屬于CSS，行為應歸屬于JavaScript腳本。分層的一些好處包括：

共享資源：當您編寫外部CSS或JavaScript文件時，站點上的任何頁面都可以使用該文件。如果您需要對該文件進行更改，可能是為了更新網站上的某些排版樣式，則使用該樣式表的每個頁面都將獲得更改。沒有必要單獨編輯網站的每一頁，這對一個大型網站來說可能是一項艱巨的任務。

加載速度更快：一旦客戶首次下載腳本或樣式表，Web瀏覽器就會緩存該腳本或樣式表。由于這些共享資源現在包含在瀏覽器的緩存中，因此在瀏覽器中請求的其他頁面加載得更快，從而提高了總體頁面速度和性能。

方便團隊協作：如果您有多個人同時在一個網站上工作，您可以使用允許檢入和檢出文件的系統，以確保每個人都在使用最新版本。如果樣式和行為與結構文檔交織在一起，則很難做到這一點。

搜索引擎優化：對于搜索引擎來說，具有清晰的風格和結構分離的站點可能會表現得更好，因為它們可以更有效地抓取內容并理解頁面，而不會陷入視覺樣式和行為信息的泥潭。

可訪問性更強：外部樣式表和腳本文件更便于用戶和瀏覽器訪問。諸如屏幕閱讀器之類的軟件可以更輕松地處理來自結構層的內容，而無需處理他們無論如何都不能使用的樣式。

兼容性更好：使用單獨的開發層設計的站點更有可能是向后兼容的，因為不能使用特定CSS樣式或禁用JavaScript的瀏覽器和設備仍然可以查看HTML。然后，您可以逐步增強您的網站與支持他們的瀏覽器的功能。

接下來，讓我們一起梳理下并回顧下三個層次的知識點：

HTML：結構層

網頁的結構或內容層是該網頁的基礎HTML代碼。就像一棟房子的框架創建了一個堅實的基礎，房子的其余部分是建立在上面一樣，HTML的堅實基礎創建了一個平臺，在這個平臺上可以創建一個網站。

結構層是存儲客戶想要閱讀或查看的所有內容的地方。HTML結構可以由文本和圖像組成，它包括訪問者將用于在網站上導航的超鏈接。這是用符合標準的HTML5編碼的，可以包括文本、圖像和多媒體(視頻、音頻等)。站點內容的每個方面都應該在結構層中表示。這允許已關閉JavaScript或無法查看整個網站(如果不是全部功能)的CSS訪問的客戶。

CSS：樣式圖層

這一層規定了結構化HTML文檔對站點訪問者的外觀，并由CSS(層疊樣式表)定義。這些文件包含有關如何在Web瀏覽器中顯示文檔的樣式說明。樣式層通常包括根據屏幕大小和設備更改站點顯示的媒體查詢。網站的所有視覺樣式都應位于外部樣式表中。您可以使用多個樣式表，但是請記住，每個CSS文件都需要一個HTTP請求來獲取它，這會影響站點性能。

JavaScript：行為層

行為層使網站具有交互性，允許頁面響應用戶操作或根據一組條件進行更改。JavaScript是行為層最常用的語言，但CGI和PHP也非常常用。當開發人員提到行為層時，大多數指的是直接在Web瀏覽器中激活的層。您可以使用該層直接與DOM(DocumentObjectModel，文檔對象模型)交互。在內容層中編寫有效的HTML對于行為層中的DOM交互非常重要。在行為層中構建時，應該使用外部腳本文件，就像使用CSS一樣，以優化速度和性能。

網頁題目：從html到JavaScript網站建設時應理清的三個層次
網站鏈接：http://www.js-pz168.com/news1/154701.html

網站建設、網絡推廣公司-創新互聯，是專注品牌與效果的網站制作，網絡營銷seo公司；服務項目有網站建設等

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源：創新互聯

猜你還喜歡下面的內容

久久99久久人婷婷精品综合_超碰aⅴ人人做人人爽欧美_亚洲电影第三页_日韩欧美一中文字暮专区_波多野结衣的一区二区三区_婷婷在线播放_人人视频精品_国产精品日韩精品欧美精品_亚洲免费黄色_欧美性猛交xxxxxxxx

從html到JavaScript網站建設時應理清的三個層次