javascript - 在 IE 和跨浏览器中为书签注入 CSS 文件

Question

我有以下 JS 代码，它将带有属性和 href 的链接标记注入页面头部，此代码适用于除 Internet Explorer 之外的所有浏览器。

var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.id = '_mgc_css';
document.getElementsByTagName("head")[0].appendChild(link);
link.href = url + "css/bookmarklet.css";

似乎问题在于注入新工作表时 IE 不会刷新页面上的样式。我已经尝试过 IE 的 createStylesheet() 方法，这似乎也不起作用。

关于我可以尝试使其跨浏览器的任何想法或建议？

Answer 1

在 IE8+ 中试试这个应该可以。

var headHTML = document.getElementsByTagName('head')[0].innerHTML;
headHTML    += '<link type="text/css" rel="stylesheet" href="+url + "css/bookmarklet.css"+">';
document.getElementsByTagName('head')[0].innerHTML = headHTML;

编辑：或像这样

var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = url + "css/bookmarklet.css";
cssNode.title = 'title_goes_here';
document.getElementsByTagName("head")[0].appendChild(cssNode);

Answer 2

只需更改您的代码行位置

var url = "location/"
var link = document.createElement("link");
link.type = "text/css";
link.rel = "stylesheet";
link.id = '_mgc_css';
link.href = url + "css/bookmarklet.css";
document.getElementsByTagName("head")[0].appendChild(link);