1. 引入js文件
在网页中引入js文件可以使用script标签，在script标签的src属性中指定js文件的路径。以下是一个例子：
<!DOCTYPE html>
<html>
<head>
<title>引入js文件</title>
<script src="example.js"></script>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落</p>
</body>
</html>
在这个例子中，example.js文件被引入到了网页中。注意到script标签是放在body标签的底部，这是因为js代码的执行会阻塞其他资源的加载，如果将script标签放在head标签中，会导致下面的内容在脚本加载完毕才开始加载。
1.1 引入外部库
有些js代码是通过外部库来实现的，比如jQuery、React等，这些库需要从外部引入。同样使用script标签，只需要在src属性中指定对应的库文件路径即可。
<!DOCTYPE html>
<html>
<head>
<title>引入jQuery库</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落</p>
<script>
// 使用jQuery的代码
</script>
</body>
</html>
上面的例子中是引入的jQuery库文件，该文件被托管在CDN上，也可以引入本地文件。
1.2 使用defer和async属性
使用defer和async属性可以改变脚本的加载和执行顺序，从而更好的提高网页性能。
defer属性：告诉浏览器不要等待js脚本的加载和执行，而是加载完成后再执行js代码。defer脚本按照它们在页面中出现的顺序执行。
async属性：告诉浏览器可以异步加载和执行js脚本。async脚本之间的执行顺序是不确定的。
下面的代码展示了如何使用defer和async属性：
<!DOCTYPE html>
<html>
<head>
<title>defer和async属性</title>
<script src="example1.js" defer></script>
<script src="example2.js" async></script>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落</p>
<script src="example3.js"></script>
</body>
</html>
上面的代码中，example1.js脚本使用了defer属性，example2.js脚本使用了async属性。example3.js脚本没有使用任何属性，会在加载时执行。
2. 引入css文件
在网页中引入css文件可以使用link标签，在link标签的href属性中指定css文件的路径。以下是一个例子：
<!DOCTYPE html>
<html>
<head>
<title>引入css文件</title>
<link rel="stylesheet" href="example.css">
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落</p>
</body>
</html>
在这个例子中，example.css文件被引入到了网页中。
2.1 css文件的位置
css文件的位置有多种选择，可以放在
标签中，也可以放在标签中。将css文件放在标签中比放在标签中更为常见。另外，放在标签中的css文件可以使用media属性指定加载条件，如仅在特定设备或屏幕尺寸下加载。
<!DOCTYPE html>
<html>
<head>
<title>css文件的位置</title>
<link rel="stylesheet" href="example.css" media="screen and (min-width: 768px)">
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落</p>
<link rel="stylesheet" href="example2.css">
</body>
</html>
上面的例子中，example.css文件只会在屏幕宽度大于等于768px时加载，example2.css文件则会在整个页面加载时加载。
2.2 css文件的内容
css文件中定义了网页中的样式，可以包含多个选择器和声明块。以下是一个简单的css文件：
h1 {
color: red;
}
p {
color: blue;
font-size: 14px;
}
该css文件中有两个选择器：h1和p，分别选择网页中的标题和段落元素。每个选择器都包含了一个或多个声明块，声明了选择器对应元素的样式属性和值。如h1选择器中声明了color属性为red，即标题元素的文本颜色为红色。
2.3 css文件的优化
为了优化网页的性能，可以对css文件进行压缩和合并操作。
压缩：删除css文件中的注释和空格等无用字符，减小文件体积。
合并：将多个css文件合并为一个文件，减小HTTP请求次数。
以上操作可以手动完成，也可以使用工具进行自动化处理，如Grunt、Gulp等。
总结
通过script和link标签可以将js和css文件引入到网页中，为网页提供额外的功能和样式。在使用时，需要注意脚本的位置和加载顺序，并对css文件进行压缩和合并操作从而提升网页性能。