数据结构
网络
关系数据库管理系统 (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
