我们在HTML中经常需要引入CSS和JS文件，那么如何引入呢？下面我给大家演示一下。
工具/材料Sublime Text
01首先新建一个文件夹，在文件夹下面建立如下图所示的文件
02接下来用Sublime Text打开HTML文件，写入HTML结构，如下图所示
03然后我们在Head标签内用link标签引入CSS文件，如下图所示
04最后用Script标签引入JS文件即可，如下图所示
在网上下载好字体包在static下新建文件夹，名字自定义，用来存放字体包
在新建好的文件夹下新建一个css文件，同样名称自定义
在这里插入图片描述
检查自己的 webpack.base.conf.js 文件，是否有如下代码，没有需要自己写上
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
}
}
打开刚才新建的 css 文件
@font-face{
font-family: '思源黑体'
src: url('../siyuan/SourceHanSansCN-Normal-2.otf')
font-weight: normal
font-style: normal
}
接着在main.js文件中引入css文件
import '../static/siyuan/font.css'
在需要设置该字体的位置写font-family:'思源黑体' 就可以了
方法一，在调用文件的顶部加入下例代码：
document.write(”<script language=javascript src=’/js/import.js’></script>”)(注：有时你引用的文件还可能需要引用其他的js,我们需要将需要的那个js文件也以同样的方法引用进来)
方法二,通过中间界面对js进行应用
就是我们可以在某个html中引用了你需要的js文件，我们可以通过拿到那个html文件的对象，然后在通过这个对象去引用js的方法。
（一般不常用）
方法三：在将下边代码放入Body中：
new_element=document.createElement(”script”)new_element.setAttribute(”type”,”text/javascript”)
new_element.setAttribute(”src”,”import.js”)
document.body.appendChild(new_element)
我们来分析一下关键的几句代码：
首先，我们利用document.createElement(”script”)生成了一个script的标签，设置其 type属性为text/javascript，src为import.js(这里的1.js同2.js放在同一个目录，也可放在不同的目录)。最后将这个标签动态 地加入body中。如此一来，我们就可以调用到不同js文件中的方法了。
注意：<script language=”JAVASCRIPT” src=’1.js’></script>一定要放在body下面。
因为在2.js中用到了body（document.body.appendChild(new_element)）
如果将引如2.js的代码放在body上面，也就是说，
进入页面后，还没有生成body就已经执行b.js里的document.body.appendChild(new_element)了。
这时body不存在就会抛JavaScript错误。
