html页面动态加载css，可以根据系统参数配置

正常的加载是在head中引入css链接 如下

如果我想动态加载怎么处理 用jQuery 来加载

1、先定义一个 加载样式的方法

在script标签中添加

var loadStyle = function(url) {
    var link = document.createElement('link');
    link.rel = "stylesheet";
    link.type = "text/css";
    link.href = url;
    var head = document.getElementsByTagName("head")[0];
    head.appendChild(link);
};

2、页面加载完毕之后  在script标签中添加初始化方法

yml文件配置名称

 

后台获取方法

 

 

根据ajax后台动态请求需要加载的css名称

(function () {

    $.ajax({
        type: 'get',
        //data: {"menuId": this.item.menuId, "from":'tab'},
        url: 'frame/getStyle.action',
        success: function(result){
            var json = eval("("+result+")");//将json类型字符串转换为json对象
            console.log('获取样式'+json.configZt);
            if(json.configZt){
                // css加载
                loadStyle('ext/resources/css/'+json.configZt+'.css');
            }
            if(json.configMenuIcon){
                // css加载
                loadStyle('css/'+json.configMenuIcon+'.css');
            }
        }
    });


})();