我有一个 javascript 文件,它的功能之一是使用 javascript 创建一些 HTML。
HTML 在运行时创建并创建以下元素:
var oBox = document.createElement("notifiedusersbubble");
oBox.style.color="#808080";
oBox.style.display = "none";
oBox.style.position= "absolute";
oBox.style.width="200px";
oBox.style.border = '1px solid black';
oBox.style.background = "#DDEFF1";
oBox.style.fontFamily="arial,sans-serif";
oBox.style.padding="2px 2px 2px 4px";
我不想将所有样式都留在 javascript 文件中,而是想将 t 放入 CSS 文件并从那里引用它。
问题是,我不知道如何使用 javascript 执行此操作。我知道要使用 HTML 这样做,我会在 <head>
中编写以下内容标签:
<link href="style.css" rel="stylesheet" type="text/css" />
最佳答案
您可以像创建任何其他元素一样创建 link
元素:
var link = document.createElement('link');
link.rel = "stylesheet";
link.type = "text/css";
link.href = "style.css";
document.querySelector("head").appendChild(link);
...但话虽如此,我通常希望您将其留给页面作者,只需将其列为脚本的要求,即必须将 CSS 放在页面上——尤其是因为它可以让他们将这些内容结合起来CSS 与其他 CSS 一起避免大量 HTTP 请求等。这是每个主要框架/库(jQuery UI、Bootstrap 等)所做的。
关于javascript - 如何在仅限 JavaScript 的类中引用 CSS 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27312740/