来自未来的回答。 在2022年，我们有导入断言api用于导入css文件。

import mycss from "./style/mycss.css" assert { type: "css" };
    document.adoptedStyleSheets = [sheet];
    shadowRoot.adoptedStyleSheets = [sheet];

浏览器支持: 截至2022年9月，仅支持基于铬的浏览器。

更多信息请访问: V8导入断言post

tc39 github T39导入断言建议

如果你使用jquery:

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

使用以下代码:

var element = document.createElement("link");
element.setAttribute("rel", "stylesheet");
element.setAttribute("type", "text/css");
element.setAttribute("href", "external.css");
document.getElementsByTagName("head")[0].appendChild(element);

我知道这是一个相当老的帖子，但这里是我的5美分。

根据您的需要，还有另一种方法可以做到这一点。

我有一个情况下，我想要一个css文件是活跃的，只有一段时间。比如css切换。激活css，然后在另一个事件后取消激活它。

而不是动态加载css然后删除它，你可以在新css的所有元素前添加一个Class/ id，然后只需切换css的基本节点的Class/ id(如body标签)。

你会用这个解决方案有更多的css文件最初加载，但你有一个更动态的方式切换css布局。

有一个通用的jquery插件，可以按需加载css和JS文件的同步和异步。 它还可以跟踪已经加载的内容:) 参见:http://code.google.com/p/rloader/

下面是一个单行示例，使用纯JavaScript根据URL的文件名部分将CSS链接注入到head元素中:

document.head.innerHTML += '<link rel=“stylesheet” href=“css/style.css”>';

大多数浏览器都支持它。查看浏览器兼容性。