使用jquery动态加载JS和CSS
使用jquery动态加载JS和CSS
提问于 2014-08-24 19:26:08
考虑只在需要弹出窗口时才尝试加载jquery的代码。当用户单击链接时，将调用此代码。
$.when( $.ajax({url: "http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css", dataType: "html", cache: true}),
$.ajax({url: "http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js", dataType: "script", cache: true}),
$.ajax({url: "../../plugins/jquery.dialogextend.js", dataType: "html", cache: true}) )
.then(
function() { ...code for dialog goes here此代码失败是因为jquery-ui.css由于相同的起源策略而不会加载。错误消息是“相同的原产地策略不允许在http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css读取远程资源。可以通过将资源移动到相同的域或启用CORS来修复此问题”
现在我很困惑，想找出以下两个问题的答案。
- 在这段代码中，jquery-ui.min.js被加载，但是jquery-ui.css没有加载。由于相同的起源策略，如果jquery-ui.css没有加载，那么jquery-ui.min.js是如何加载的？
- 当我们在标题中包含jquery-ui.css时，作为
<link href="http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css"，它将加载。为什么同一原产地政策不适用于这里？
请帮助我理解这一点。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-08-24 19:49:02
编辑、更新
请参阅同源政策
以下是一些可以嵌入跨源资源的示例：
- JavaScript和
<script src="..."></script>。语法错误的错误消息仅适用于相同来源的脚本。 - CSS与
<link rel="stylesheet" href="...">。由于CSS语法规则宽松，跨源CSS需要正确的内容类型标头.限制因浏览器而异:即，Firefox，Chrome，Safari (向下滚动到CVE-2010-0051)和Opera。
注意，dataType在$.ajax()请求"http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css"时似乎是html？
试一试
$.when( $("head").append("<link rel=stylesheet href=http://code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css />")
, $.ajax({url: "http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.0/jquery-ui.min.js", dataType: "script", cache: true})
, $.ajax({url: "../../plugins/jquery.dialogextend.js", dataType: "html", cache: true}) )
.then(
function() { ...code for dialog goes here页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25475471
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号