为了账号安全,请及时绑定邮箱和手机立即绑定

关于动态改变<link>标签的href

关于动态改变<link>标签的href

喵喔喔 2018-09-14 11:10:05
如题,我创建了两个<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">


查看完整回答
反对 回复 2018-10-16
  • 1 回答
  • 0 关注
  • 2426 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号