Question

我们需要在Web应用程序中添加脚本。它基本上增加了一个企业菜单。

所以我们收到了一个脚本，要包含在我们的webapp主体中：

<!-- BEGIN NAVIGATION -->
<script type="text/javascript" src="https://intranet.local/?getCorporateJsMenu"></script>
<!-- END NAVIGATION -->

https://intranet.local/?getCorporateJsMenu的内容基本上如下：

document.write('<script type="text/javascript" src="..."></script>');
//....
document.write('<div>');
document.write('<ul>');
//...
document.write('<li><a href="...">...</a></li>');
//...
document.write('</ul>');
document.write('</div>');

将<script...直接放入html正文后，我们遇到了严重的页面加载性能问题。

所以我们的想法是用JS添加菜单，当所有东西都加载了这样的东西时：

var script=document.createElement('script');
script.type='text/javascript';
script.src='https://intranet.local/?getCorporateJsMenu';
var domparent=jQuery('#header').get();
domparent[0].appendChild(script);

我们看到firebug，脚本元素已添加到html中，并且脚本已从网络加载，但是加载脚本的document.write不会被执行？

更新：我们无法修改https://intranet.local/?getCorporateJsMenu的内容，因为它来自第三方

Answer 1

这是因为脚本执行在第一个找到的文字</script>标记处停止，无论它是否括在括号中。您需要对结束script标记进行模糊处理，例如：

document.write('<script type="text/javascript" src="..."><\/script>');

但是，您似乎也使用jQuery，为什么不使用jQuery方法加载脚本并将内容添加到页面而不是document.write()？

Answer 2

这里有一个劫持document.write（）的例子，它将21世纪的加载性能带入遗留脚本：

<script>
var writes=[];
document.write=[].push.bind(writes);
</script>
<div id=targ></div>
<script type="text/javascript" src="https://intranet.local/?getCorporateJsMenu"></script>
<script>
 document.getElementById("targ").innerHTML=writes.join(" ");
</script>

我使用这些模式来支持SPA网站上的广告，以及缓存嵌入，并在一种情况下在注入之前修改内容的样式。

Answer 3

试试这个：

document.write('<scr'+'ipt type="text/javascript" src="..."></scr'+'ipt>');

如何在document.write中包含脚本？

3 个答案: