如何使用jquery / AJAX加载外部CSS文件？

Question

我在10秒钟后发送AJAX请求以从Nodejs Server获取数据，但我一直收到将资源解释为样式表并转换为mime类型html / css的信息。 服务器返回text / html。 代码工作正常，但外部CSS不能工作。 以下代码对我来说功能正常，但我想加载外部CSS文件

我的代码在这里

$(document).ready(function() {
    timer = window.setTimeout(function() {
        $.ajax({
            url: '/jrt/?Id=$data.jet.id',
            method: "GET",
            cache: false,
            success: function(data) {
                //$("#gt").append(data);
                $('#gt').html(data);
                if (state == 'jr' || state == 'jt')
                {
                    window.clearTimeout(timer);
                }
            },
            error: function(jqXHR, textStatus, errorThrown) {
                alert('error ' + textStatus + " " + errorThrown);
            }
        })
    }, 10000);
});

Answer 1

基于此答案。 看来只是用javascript。

这段代码创建了一个id，用于检查if语句link.id是否已经存在。 然后，它创建一个<link></link> ，然后添加所有属性。

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

未经测试，但这也许可以工作：

var cssId = 'myCss';  // you could encode the css path itself to generate id..
if (!document.getElementById(cssId))
{
    var $head  = $('head');
    var link  = document.createElement('link');
    link.attr({
        id:cssId, 
        rel:'stylesheet',
        type:'text/css',
        href:'http://website.com/css/stylesheet.css', 
        media:'all'
    });
    $head.append(link);
}