我正在开发一个遗留企业应用程序，其代码是 2001 年使用 JavaScript、HTML、Intersystems Caché 和 Caché Weblink 的组合编写的。
Web 应用程序的 index.html 中存在以下内容:
<HTML>
<HEAD>
</HEAD>
<FRAMESET ROWS="32,*" FRAMEBORDER="no" border="0" framespacing="0">
<FRAME
SRC="sysnav.html"
NAME="sysnav"
SCROLLING="no"
MARGINHEIGHT="10"
MARGINWIDTH="10"
NORESIZE>
<FRAME
SRC="cgi-bin/nph-mgwcgi?MGWLPN=dev&wlapp=SYSTEM&SystemAction=DisplayContentFrame"
NAME="content"
SCROLLING="auto"
MARGINHEIGHT="0"
MARGINWIDTH="10">
</FRAMESET>
<noframes>
</noframes>
</HTML>
我遇到的问题是，在 content 框架中，该框架的 HTML 每次都会自动生成，但我需要在框架中包含 jQuery。
我可以采取任何 hack/workaround 将 jQuery 插入 content 框架吗？
最佳答案
正如评论中提到的，只要框架位于同一域中，jQuery 就可以注入(inject)到框架中。
普通 Javascript
像下面这样的脚本标签可以添加到 <head> index.html 的元素。它一直等到内容框架通过 addEventListener() 加载完毕。然后动态添加一个<script>带有指向由 Google Hosted Libraries 托管的 jQuery 代码的 src 属性的标记.
<script type="text/javascript">
window.addEventListener('DOMContentLoaded', function() {
frames['content'].addEventListener('load', function() {
var contentFrameHead = frames["content"].document.getElementsByTagName("head")[0];
var newScriptTag = document.createElement('script');
newScriptTag.src = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js';
contentFrameHead.appendChild(newScriptTag);
});
});
</script>
参见 this plunker example 中的演示.尝试单击标记为Test jQuery Loaded in this frame? 的按钮，然后在注释 index.html 的第 10 行时查看结果如何变化。 p>
在 index.html 中使用 jQuery
也许开销太大，但如果将 jQuery 添加到 index.html，则可以使用 jQuery 辅助函数。我试图利用这些来缩短代码，但在尝试使用 $() 创建脚本标签时遇到了问题- 引用 this answer详细解释为什么这不起作用。
所以使用 jQuery 辅助函数的代码并没有短很多......
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>-->
<script type="text/javascript">
$(function() { //DOM-ready
$(frames['content']).on('load', function() { //load for content frame
var newScriptTag = document.createElement('script');
newScriptTag.src = 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js';
var contentFrameHead = frames["content"].document.getElementsByTagName("head")[0];
contentFrameHead.appendChild(newScriptTag);
});
});
如果内容框架有不同的域
否则，如果内容框架的域与 index.html 的域不同，则服务器端脚本(例如，将 PHP 与 cURL、nodeJS 等结合使用)可能是需要获取该页面的内容并包含 jQuery 库(它本身可能很麻烦)。
关于javascript - 如何在框架内加载 jQuery？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45765557/