HTML中引入css和js的方法

JavaScript06

HTML中引入css和js的方法,第1张

我们在HTML中经常需要引入CSS和JS文件,那么如何引入呢?下面我给大家演示一下。

工具/材料

Sublime Text

01

首先新建一个文件夹,在文件夹下面建立如下图所示的文件

02

接下来用Sublime Text打开HTML文件,写入HTML结构,如下图所示

03

然后我们在Head标签内用link标签引入CSS文件,如下图所示

04

最后用Script标签引入JS文件即可,如下图所示

JS文件中动态调用外部css, 文件方法如下:

function loadExtentFile(filePath, fileType){

if(fileType == "js"){

var oJs = document.create_rElement('script')

oJs.setAttribute("type","text/javascript")

oJs.setAttribute("src", filename)//文件的地址 ,可为绝对及相对路径

document.getElementsByTagName_r("head")[0].appendChild(oJs)//绑定

}else if(fileType == "css"){

var oCss = document.create_rElement("link")

oCss.setAttribute("rel", "stylesheet")

oCss.setAttribute("type", "text/css")

oCss.setAttribute("href", filename)

document.getElementsByTagName_r("head")[0].appendChild(oCss)//绑定

}

}

loadExtentFile("js/func.js", "js")

loadExtentFile("default.css", "css")

清空:

var lists = document.getElementsByTagName_r("link")

for ( var i = 0i <lists.lengthi++) {

if (lists[i].getAttribute("href").indexOf(".css") != -1) == -1) {

lists[i].parentNode.removeChild(lists[i])

}

}

上面的判断语句中可以加入自己的判断。