javascript实现动态加载CSS

最近我正在开发一个小框架的按需加载模块，需要实现异步动态加载CSS文件。经过一番深入研究，我得到了一个实用的解决方案，想与大家分享。

让我们看看如何通过JavaScript动态加载CSS文件。代码如下：

```html

```

我还发现了一个非常实用的函数，不仅可以用于加载CSS文件，还可以加载JS文件，甚至可以用于实现网页换肤功能。代码如下：

```javascript

function $import(path, type, title) {

var s, i;

if (!type) type = path.substr(path.lastIndexOf(".") + 1);

if (type == "js") {

var ss = document.getElementsByTagName("script");

for (i = 0; i < ss.length; i++) {

if (ss[i].src && ss[i].srcdexOf(path) != -1 || ss[i].title == title) return ss[i];

}

s = document.createElement("script");

s.type = "text/javascript";

s.src = path;

if (title) s.title = title;

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

var ls = document.getElementsByTagName("link");

for (i = 0; i < ls.length; i++) {

if (ls[i].href && ls[i].hrefdexOf(path) != -1 || ls[i].title == title) return ls[i];

}

s = document.createElement("link");

s.rel = "stylesheet";

s.type = "text/css";

s.href = path;

if (title) s.title = title;

s.disabled = false; // 确保样式表被立即加载并应用，而不是在文档完全加载后才生效。

} else return;

var head = document.getElementsByTagName("head")[0];

head.appendChild(s);

return s;

}

``` 可以通过调用`$import`函数来按需加载JS或CSS文件，例如：`$import('path/to/your/script.js', 'js')` 或 `$import('path/to/your/style.css', 'css')`。这个函数非常灵活，可以根据需要加载不同的资源。这个函数对于实现网页换肤功能特别有用，只需改变CSS文件的路径即可实现皮肤更换。这是一个非常实用的函数，值得大家深入研究并应用到实际开发中。