Javascript 使用JS向文档添加样式表

上面的代码是我用来将样式表添加到文档中的代码。代码检查器显示代码已添加，但控制台不显示浏览器已请求文档，且样式不生效

如何将样式表添加到已加载的文档并使其生效

顺便说一句，如果有关系的话，我将把这个代码用于一个小部件，所以我将在多个域中使用

提前感谢您的帮助

试试这个：

---

好的，在做了一些测试之后，我终于明白了到底发生了什么。原始代码由@Vicky Gonsalves提供

(function () {
    var li = document.createElement('link');
    li.type = 'text/css';     
    var href='http://' + 'thesite.com/api/widgets/tghd/pages.css';
    li.setAttribute('href', href);
    var s = document.getElementsByTagName('head')[0];
    s.appendChild(li, s);
})();

我对此所做的更改如下：

我添加了http和https开关来帮助处理不同的连接类型

---

添加了属性li.setAttribute'rel'，'stylesheet'；嘿，我试过了，但还是不行。我可以看到样式表已添加到标题中，但浏览器未加载样式表，样式也未生效。我在dev中禁用了浏览器缓存，但我还清除了所有数据，甚至在多个浏览器上进行了尝试。

(function () {
    var li = document.createElement('link');
    li.type = 'text/css';     
    var href='http://' + 'thesite.com/api/widgets/tghd/pages.css';
    li.setAttribute('href', href);
    var s = document.getElementsByTagName('head')[0];
    s.appendChild(li, s);
})();

    var li = document.createElement('link');
    li.type = 'text/css';     
    var href=('https:' == document.location.protocol ? 'https://' : 'http://') +'thesite.com/api/widgets/pages.css';
    li.setAttribute('href', href);
    li.setAttribute('rel','stylesheet');
    var s = document.getElementsByTagName('head')[0];
    s.appendChild(li, s);