資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究為什麼我們需要外部CSS和JS檔案
在這篇文章中，我們將學習CSS和JS檔案。我們將探討它們的功能以及在HTML文件中使用它們的各種方法。學習完這些之後，我們將理解為什麼我們需要外部CSS和JS檔案。CSS
CSS代表層疊樣式表（Cascading Style Sheets）。CSS用於為您的網站和網頁應用樣式。它用於使網頁看起來更易於理解、更具表現力，並對使用者更具吸引力。CSS檔案可以使用任何文字編輯器編寫，但必須以.css副檔名儲存。
簡單的HTML文件會為您提供一個資訊雜亂無章的網頁。為了組織這些資訊並以適當的方式顯示它們，我們使用CSS檔案。CSS的一些用途包括背景顏色選擇、字型大小選擇、字型顏色、文件寬度等等。
在HTML文件中使用CSS主要有三種方式：
內聯樣式 - 在內聯CSS中，我們在<body>標籤內使用CSS屬性，每個元素的CSS屬性都附加到元素本身。
內部樣式或嵌入式樣式 - 在內部CSS中，我們在HTML文件的head部分使用CSS屬性。我們必須在head部分建立一個<style>標籤，其中包含HTML文件的所有樣式。
外部樣式 - 在外部CSS中，我們在HTML文件之外定義一個單獨的CSS檔案，其中包含網頁的所有樣式。我們使用<link>標籤將外部css檔案連結到HTML檔案，以便將所有css屬性應用於HTML標籤。
示例
<!DOCTYPE html> <html> <head> <title>External CSS</title> <link rel="stylesheet" href="file.css"> </head> <body> <h1>Computer Science </h1> <p>It is the most evolving sector of the industry and there are lot of job opportunities in this field in upcoming years.</p> </body> </html>
JS
JS代表JavaScript。它是一種用於Web的程式語言，用於為網頁提供自定義的“行為”。透過使用JS，我們可以為網站新增互動性，使其在視覺上更具吸引力、更有趣，並新增許多附加功能，以使使用者體驗更加完善。在HTML檔案中使用JS主要有兩種方法：
內部JS - 在這種方法中，我們使用<script>標籤將我們的JS程式碼嵌入到HTML檔案本身。如果我們只需要在網頁上實現有限的功能（例如新增動畫、接受小型表單），它非常有用。但是，隨著程式碼複雜性的增加，使用外部JS檔案變得越來越重要。
外部JS - 如果我們建立一個副檔名為.js的檔案，它就成為一個JavaScript檔案，並將包含網站所需的所有程式碼。為了將其與HTML檔案連結，我們需要使用<script>標籤以及定義JS檔案源的src屬性。
示例
<!DOCTYPE html> <html> <head> <title>External JS</title> </head> <body> <p>Let’s understand why external JS is prioritized over internal JS.</p> <script src="external.js"></script> </body> </html>
為什麼我們需要外部JS和CSS檔案
CSS - 使用外部CSS而不是內聯或內部CSS的主要原因之一是外部CSS檔案可重用，即它可以用於多個HTML文件。我們可以建立一個CSS檔案，然後使用<link>標籤將其附加到不同的HTML檔案，它將在每個網頁上應用相同的屬性。
另一個主要原因是它在樣式程式碼（即CSS）和資訊程式碼（即HTML）之間建立了分離。在內聯或內部CSS中，我們將HTML標籤和CSS一起編寫或寫在HTML檔案中，這在編輯時會造成混淆。
外部CSS解決了這個問題，因為HTML和CSS都儲存為不同的檔案，如果出現任何問題，我們就知道我們的CSS程式碼在哪裡，HTML程式碼在哪裡。
此外，根據Google的一項實驗，使用外部CSS的網站會被優先推薦給使用者，因為它具有更簡潔的程式碼，使搜尋引擎更容易訪問資訊。
JS - 使用外部JS檔案允許我們減少將多個功能的程式碼放在同一個地方可能造成的複雜性，方法是為每個功能使用單獨的JS檔案。
使用外部JS檔案的另一個優點是與內部JS檔案相比，它能夠更快地除錯程式碼。
假設我們有一個包含數千行程式碼和許多功能的內部JS檔案。如果我們在網頁上遇到異常行為，我們將不得不遍歷整個程式碼，這將是一個漫長的除錯過程。
但另一方面，如果我們根據它們提供的功能對程式碼進行了劃分，我們就可以很容易地找到錯誤，因為我們已經知道網站中哪個功能有問題，以及提供此功能的JS檔案位於何處。
瀏覽量：377
