### JS与CSS引用方法详解
在网页开发过程中，JavaScript（简称JS）与Cascading Style Sheets（简称CSS）是构建动态交互式网站不可或缺的技术。合理地引用这些资源能够提升页面加载速度、改善用户体验并增强代码的可维护性。本文将详细介绍如何在HTML文档中正确引用外部JS文件和CSS样式表。
#### CSS引用方法
CSS样式表主要用于控制HTML文档的外观，如字体、颜色、布局等。在实际应用中，通常有两种方式来引入CSS：一是通过`<link>`标签链接外部样式表；二是使用`<style>`标签内嵌样式规则。
##### 1. 使用`<link>`标签链接外部样式表
这种方式适用于将CSS规则存储在一个独立的文件中，并在多个HTML页面中重用这些样式规则。例如：
```html
<!-- ASP.NET 相对服务器路径 -->
<link type="text/css" href="<%=ResolveUrl("~/css/css.css")%>" rel="stylesheet"/>
<!-- 绝对路径或相对路径 -->
<link type="text/css" href="/css/css.css" rel="stylesheet"/>
```
- **ASP.NET 相对服务器路径**：此写法中的`<%=ResolveUrl("~/css/css.css")%>`表示根据服务器根目录获取文件路径，常用于ASP.NET项目中。
- **绝对路径/相对路径**：直接指定文件的完整URL（如`/css/css.css`），这种方式适用于静态文件托管或Web应用程序。
##### 2. 内嵌样式规则
如果样式规则仅在一个HTML页面中使用，可以考虑使用`<style>`标签内嵌CSS规则，以减少HTTP请求次数。例如：
```html
<style type="text/css">
.txtClass {
font-size: 12px;
}
</style>
```
#### JS引用方法
JavaScript脚本负责实现网页上的交互逻辑，其引用方法同样有两种：一是通过`<script>`标签链接外部脚本文件；二是直接在HTML文档中内嵌JavaScript代码。
##### 1. 使用`<script>`标签链接外部脚本文件
这种方式同样适用于将JavaScript代码存储在一个独立的文件中，并在多个HTML页面中重用。例如：
```html
<!-- ASP.NET 相对服务器路径 -->
<script type="text/javascript" src="<%=ResolveUrl("~/js/jquery-1.4.2.mini.js")%>"></script>
<!-- 绝对路径或相对路径 -->
<script type="text/javascript" src="/js/jquery-1.4.2.mini.js"></script>
```
- **ASP.NET 相对服务器路径**：类似于CSS的引用方式，这里也是通过`<%=ResolveUrl("~/js/jquery-1.4.2.mini.js")%>`获取基于服务器根目录的文件路径。
- **绝对路径/相对路径**：直接指定文件的完整URL（如`/js/jquery-1.4.2.mini.js`）。
##### 2. 内嵌JavaScript代码
如果JavaScript代码仅在一个HTML页面中使用，可以直接在HTML文档中内嵌JavaScript代码。例如：
```html
<script language="javascript" type="text/javascript">
function check_up_message(text) {
// 函数体
}
</script>
```
### 总结
通过上述介绍，我们可以看到JS和CSS的引用方法虽然简单，但在实际应用中非常重要。正确选择和使用这些方法不仅可以提高网页性能，还能使代码结构更加清晰、易于维护。此外，在使用这些技术时还需要注意以下几点：
- **文件压缩**：对于大型项目而言，压缩CSS和JS文件可以显著减少文件大小，从而加快页面加载速度。
- **缓存策略**：合理设置浏览器缓存策略，可以让用户在多次访问相同资源时无需重新下载。
- **异步加载**：对于非关键资源（如某些辅助功能），可以采用异步加载的方式，避免阻塞页面渲染。
掌握这些基础知识和技术细节，有助于开发者构建出更高效、更健壮的Web应用程序。
