如何在Require.js的模块中引入css

html-css046

如何在Require.js的模块中引入css,第1张

1，首先把写好的css样式表内容存为*.css格式。如style.css2，在页面中引入这个css样式文件。用如下的方式引入。此处的href=”./css/style.css”指的是css文件存放的路径。‘.’请示当前目录（就是与引入css文件的jsp页面在同一目录）

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])

}

}

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

nodejs本身只能加载js，css文件只能做为文本被读取。

如果想要加载解析css，可以配合webpack，然后使用css-loader、style-loader来使用。

css-loader是用来加载解析css的，将其处理成对象，方便js进一步处理；

style-loader可以将css-loader处理的对象导入到html中，从而可以在网页中运行。