javascript - 根据 URL 参数加载 CSS 文件

Question

你能帮我用javascript根据URL参数加载CSS文件吗？

我有 3 个参数(一、二和三)和 3 个 CSS 文件。

if (window.location.search.search(/[?&]parameter=one(?:$|&)/) !== -1) 
{
             What code should go in there to load the css?
}

JS是否应该放在HTML文件的头部？

Answer 1

if (window.location.search.search(/[?&]parameter=one(?:$|&)/) !== -1) {

    var $ = document; // shortcut
    var cssId = 'myCss';  // you could encode the css path itself to generate id..
    if (!$.getElementById(cssId))
    {
        var head  = $.getElementsByTagName('head')[0];
        var link  = $.createElement('link');
        link.id   = cssId;
        link.rel  = 'stylesheet';
        link.type = 'text/css';
        link.href = 'css/one.css';
        link.media = 'all';
        head.appendChild(link);
    }

}
else if(window.location.search.search(/[?&]parameter=two(?:$|&)/) !== -1)
{
     //Another way & More simple
     var ss = document.createElement("link");
     ss.type = "text/css";
     ss.rel = "stylesheet";
     ss.href = "css/two.css";
     document.getElementsByTagName("head")[0].appendChild(ss);

}

等等