通过 Javascript 动态选择 CSS URL

select CSS URL dynamically via Javascript

本文关键字:CSS URL 选择 动态 Javascript 通过      更新时间:2023-09-26

有没有办法添加一个<link rel="stylesheet" type="text/css">,根据一些Javascript表达式计算动态选择URL?

(不使用jQuery或其他外部库 - 我想避免依赖外部库。

特别是我想在页面加载期间或作为页面加载的结果运行一些 Javascript,而不是在以后运行,但我确实想确保由于运行该 Javascript 而加载已替换或添加的 CSS。

试试这个:

功能:

function swapStyleSheet(sheet){
    document.getElementById('pagestyle').setAttribute('href', sheet);
}

激活:

<button onclick="swapStyleSheet('dark.css')">Dark Style Sheet</button>

欢迎您尝试此功能。

function addStylesheet(file) {
    var
        head = document.getElementsByTagName("head")[0],
        style = document.createElement("link");
    style.rel = "stylesheet";
    style.type = "text/css"; //optional
    style.href = file;
    head.appendChild(style);
}
addStylesheet("style.css");