在我们的网络应用程序中,我试图访问我们的服务器以确定他们是否对网络应用程序的布局进行了任何自定义 CSS 调整。在得到一个 bool 标志后,我从服务器返回 CSS 并在最后一个之后注入(inject)一个新的 head link
...
问题是,这并没有更新页面的样式或布局。如果我进入页面元素的来源并在开发控制台中单击该 CSS 文档,我可以通过简单地更改样式引用的值来强制它“注意到”此 css 可用。
这是我用来注入(inject) CSS 的 jquery:
$("head link[rel='stylesheet']").last().after("<link rel='stylesheet' href='4DACTION/WEB_Mobile_CustomCSS' type='text/css' media='screen'>");
知道为什么在我在调试器中对其进行更改之前它不会强制页面使用它吗?
最佳答案
我使用 Bootstrap 创建了一个示例,它完全按照您在 setTimeout
回调中使用您的代码所描述的方式进行:
setTimeout(function () {
$("head link[rel='stylesheet']").last().after("<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css' type='text/css' media='screen'>");
}, 1000);
查看:http://jsfiddle.net/v089p29a/它从平面按钮切换到 3D 按钮。
我不确定为什么这对您不起作用。也许您的网址无效,例如 adeneo建议。还要确保将代码放在 $(window).load()
或 $(document).ready()
事件处理程序中,以确保 DOM 已准备好被操纵。
关于javascript - dom 不支持以编程方式添加的样式表元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26147604/