如何用js动态导入css?

时间:2016-03-07 11:32:38

标签: javascript jquery css ajax eval

我有一些条件,所以我无法在html中加载一些css,js。因此,我决定使用$.get()动态提取。但是,我测试了js个案,但在css的情况下没有任何线索。

以下是从远程CDN动态拉动并执行js

         拉动并执行          https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js'>     

是否可以从远程获取其他javascript文件?

<pre>
    <code class='java'>
        System.out.println("It's done!");
    </code>
</pre>

<script>
    const highlightCDN = 'http://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.2.0/highlight.min.js';
    $(function(){
        $.get(highlightCDN, function(data){
            console.log('done!');
            eval(data);
        }).done(function(){
            $('pre code').each(function(i, block){
                console.log(i);
                hljs.highlightBlock(block);
            });
        });
    });
</script>

但是,我无法在eval上使用css。我能做什么?它甚至可能吗? 非常感谢!

P.S。如果我像我的例子那样拉js,我可以在拉完这个之后全局使用它吗?

1 个答案:

答案 0 :(得分:1)

你可以通过jQuery插入一个链接元素,它指向你的外部css文件,如下所示:

$('head').append($('<link rel="stylesheet" type="text/css" />').attr('href', 'external-css-stylesheet-url-goes-here'));