如何在JavaScript中插入外部样式表(动态)

Question

......正确的道路.

例如.我有一个名为foo.js的脚本.我想插入样式表声明,我可以使用以下指令:

$('head').append('<link rel="stylesheet" href="/template/foo.css" type="text/css" />');

问题:我必须将完整路径放到样式表文件中.所以我不得不把/template/foo.css放到:http://hostname/directory/template/foo.css.我无法静态设置它,因为脚本可以放在不同的服务器和不同的位置.所以它可以是:http://foo.com/bar/foo.css或http://foo.com/foo.css.

如果我可以在服务器上获取foo.js文件的路径,那将非常有用.那将是足够好的,因为我可以根据javascrpt的文件设置样式表位置.

Answer 1

我一直都这样做:

$('body').append('<link rel="stylesheet" href="/template/foo.css" type="text/css" />');

而不是头

啊......对不起,我刚刚意识到你的问题是什么.一种策略是从DOM本身提取脚本的路径:

$('script').each(function(i,el){
    var path = el.src.match(/^(.+)\/foo.js$/);
    if (path) {
        $('body').append('<link rel="stylesheet" ' +
                                'href="' + path[1] + '/foo.css" ' +
                                'type="text/css" />'
                        );
    }
})