javascript - 如何使用 jquery/AJAX 加载外部 Css 文件？

Question

我在 10 秒后发送 AJAX 请求以从 Nodejs 服务器获取数据，但我一直收到解释为样式表并转换为 mime 类型 html/css 的资源。服务器正在返回 text/html 。代码工作正常但外部 css dosnt 工作。以下代码在功能方面对我来说工作正常，但我想加载外部 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

基于 this回答。它似乎只是通过 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);
}