Question

我正在尝试动态加载脚本。这是我的代码：

document.write('<script type="text/javascript">window.jQuery || document.write(\"<script src=\'http://code.jquery.com/jquery-1.10.2.min.js\'></script>\")</script>');

这是在B.js里面，它作为脚本加载到A.html上。但我得到错误。双引号内的结束脚本标记被视为嵌套脚本标记并破坏代码。

任何想法如何解决这个问题？

Answer 1

使用：

var s = document.createElement("script");
s.type = "text/javascript";
s.src = "http://somedomain.com/somescript";
    $("head").append(s);
//or using plain js
    (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(s);

<强> dynamically-load-jquery-library-javascript

Answer 2

将</表示在JavaScript字符串文字中<\/。

转义/保持JavaScript解析器的含义相同，但HTML解析器的含义不同。

由于您的HTML包含包含HTML的JavaScript，其中包含包含HTML（!!!）的JavaScript，因此您必须双重逃避最内层的HTML。

我认为这会奏效：

document.write('<script type="text/javascript">window.jQuery || document.write(\"<script src=\'http://code.jquery.com/jquery-1.10.2.min.js\'><\\/script>\")<\/script>');

...但它很糟糕，生成一个新的脚本元素似乎没什么意义，只是为了决定是否要生成一个新的脚本元素。你会得到相同的结果：

if (!window.jQuery) {
  document.write("<script src='http://code.jquery.com/jquery-1.10.2.min.js'><\/script>";
}

Answer 3

总是使用CDN是一种很好的方法，但有时如果CDN出现故障（尽管很少见），但在这个世界上你永远不会知道任何事情都可能发生。

下面给出jQuery代码检查jQuery是否从Google CDN加载，如果没有，则它会引用你文件夹中的jQuery.js文件。

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript">
if (typeof jQuery == 'undefined') 
{
document.write(unescape("%3Cscript src='Scripts/jquery.1.9.1.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>

首先从Google CDN加载jQuery，然后检查jQuery对象。如果jQuery没有成功加载，那么它将从硬盘驱动器位置引用jQuery.js文件。在此示例中，jQuery.js是从Scripts文件夹加载的。

Answer 4

从字符串开始，从它最里面的嵌套开始，然后每次都考虑它将被解释的位置，以及它是如何被编码的。

<script src='http://code.jquery.com/jquery-1.10.2.min.js'></script>

此 HTML 将位于 String 中，转义引号和反斜杠，并在嵌套中上升

window.jQuery || document.write("<script src=\'http://code.jquery.com/jquery-1.10.2.min.js\'></script>");

此脚本将位于 HTML 内，转义标记并升级嵌套级别

<script type="text/javascript">window.jQuery || document.write("<"+"script src=\'http://code.jquery.com/jquery-1.10.2.min.js\'><"+"/script>");</script>

此 HTML 将位于 String 中，转义引号和反斜杠，并在嵌套中上升

document.write('<script type=\"text/javascript\">window.jQuery || document.write(\"<\"+\"script src=\\\'http://code.jquery.com/jquery-1.10.2.min.js\\\'><\"+\"/script>\");</script>');

这将作为外部脚本加载，所以我们已经完成了。

我选择使用"<"+"tag>..<"+"/tag>"样式来破坏标记，因为我发现它更容易逃脱。

document.write动态加载脚本

4 个答案: