如题,我创建了两个<li>分别给他们添加了点击事件,在<link>里我添加了id = "changecss",代码如下:<link rel="stylesheet" type="text/css" id = "changecss" href="css/index.css"> <ul> <li class="active" on click="javascript:document.getElementById('changecss').href ='css/index.css'">首页案例</li> <li class = "li2" on click="javascript:document.getElementById('changecss').href ='css/change.css'">详情页案例</li> </ul>但是还是无法改变<head>里的<link>标签里的href的路径,还是会加载原本的css,但新建的css文件里的css也有效果,所以特来向各位求助。。。。
1 回答

隔江千里
TA贡献1906条经验 获得超10个赞
修改href
属性确实会触发浏览器加载css
,但是这样会带来很多新问题,其他元素css
错乱等,不太好维护。比较好的做法是动态添加css
。
给你提供个动态加载css
的方法。
var addCss = function(path){ if(!path || path.length === 0){ throw new Error('argument "path" is required !'); } var head = document.getElementsByTagName('head')[0]; var link = document.createElement('link'); link.href = path; link.rel = 'stylesheet'; link.type = 'text/css'; head.appendChild(link); };
如果你不想加载css/index.css
,一开始就不需要写<link rel="stylesheet" type="text/css" id = "changecss" href="css/index.css">
添加回答
举报
0/150
提交
取消