在前端web页面中加载css样式文件是直接写死的,但如果我们需要利用一些判断条件来加载css文件该如何做呢?那下面就来说说利用js脚本来动态加载css文件的方法。
js动态加载css样式文件的方法
例:
js代码:
var link = document.createElement('link'); link.rel = 'stylesheet'; link.type = 'text/css'; link.href = 'https://www.feiniaomy.com/style.css'; //这里是CSS文件的地址 var head = document.getElementsByTagName('head')[0]; head.appendChild(link);
代码解释:
1、使用 js 脚本中的 createElement 方法创建一个link标签HTML元素
2、给创建的 link 元素加入一些属性
3、将创建好的HTML元素插入到文档中的 head 标签中