Javascript 动态加载的函数能否完成编写动态加载它们的页面

Javascript 动态加载的函数能否完成编写动态加载它们的页面,javascript,Javascript,请帮忙 问题:我可以动态加载一个JS文件(/scripts/banner.JS),然后使用它的一个函数——writeBanner(document,t1,t2,t3)——来完成页面的编写吗 我读到眼睛流血,但是: --我找到的每个示例都假设读者在呈现页面后调用函数,并且 --每个例子都假设阻塞是坏的 不幸的是: --我需要调用函数来完成加载它们的页面的编写,然后 --阻塞不是问题。该应用程序部署为EAR文件,因此此后无需从其他任何地方下载JS文件 为什么要这样做 初始窗口(“TAPP”)从6个J

请帮忙

问题:我可以动态加载一个JS文件(/scripts/banner.JS),然后使用它的一个函数——writeBanner(document,t1,t2,t3)——来完成页面的编写吗

我读到眼睛流血,但是:

--我找到的每个示例都假设读者在呈现页面后调用函数,并且

--每个例子都假设阻塞是坏的

不幸的是:

--我需要调用函数来完成加载它们的页面的编写,然后

--阻塞不是问题。该应用程序部署为EAR文件,因此此后无需从其他任何地方下载JS文件

为什么要这样做

初始窗口(“TAPP”)从6个JS文件加载12个函数。所有页面都使用它们在页面的body元素中编写HTML,该元素显示一个一致的横幅,最多有3个参数化标题行

一级页面:这些页面在初始(“TAPP”)窗口中相互打开。它已经加载了所有功能–工作正常

二级页面:这些页面在一级页面打开的弹出窗口中打开。他们使用“this.opener”,即“TAPP”来调用这些函数——效果非常好

现在我希望能够同时打开二级页面

--作为2级页面的弹出窗口,以及

--作为独立页面

注意:使用此选项的所有level-2 pages.jsp都包括编写HEAD元素:

<%@ include file='/jsp-pages/level-2/headers/beg.jsp' %>

这样,我只需要在同一时间、同一地点处理所有这些脚本

第一步:我将以下代码添加到beg.jsp:

<script language="javascript">
  var SH = "";
  if (this.opener && this.opener.name == "TAPP") {
    SH = this.opener; // TAPP has all required functions
  } else {
    //Dynamically add the required <script> elements
    /************************************/
    // see code I tried below
   /************************************/
   SH = this; // "this" now has all the functions TAPP has
   //        alert ("Opener is NOT TAPP: " + SH);
  }
  // All pages can now call SH.writeBanner(document, t1,t2, t3) with their own titles
</script>

var SH=“”;
if(this.opener&&this.opener.name==“TAPP”){
SH=this.opener;//TAPP具有所有必需的功能
}否则{
//动态添加所需的元素
/************************************/
//请参阅下面我尝试的代码
/************************************/
SH=this;/“this”现在具有TAPP的所有功能
//警报(“开启器不是TAPP:+SH”);
}
//所有页面现在都可以使用自己的标题调用SH.writeBanner(文档,t1、t2、t3)
这就是问题所在。当上面的alert()函数未注释时,这两种尝试(DOM和下面的document.write())都能正常工作。当它被注释掉时,作为弹出窗口打开的二级页面工作得很好,但当作为独立页面打开时,不会写标题。显然,它们是在加载脚本之前呈现的

我的约会:

--放弃!跳过上面的代码。在“/jsp pages/level-2/headers/beg.jsp”中硬编码另外六个标记,每次以任何方式打开任何level-2页面时,这些标记都将重新加载六个JS文件中的函数

丑陋、不雅观、多余,如果页面是以弹出窗口的形式打开的,则是一种浪费,必须不惜一切代价避免

--当TAPP不是this.opener时,使用DOM通过在文件末尾添加脚本元素来加载JS文件

<script type="text/javascript"> 
  function   dynamicload(){
    var head = document.getElementsByTagName("head")[0];
    var script = document.createElement('script');
    script.setAttribute("type","text/javascript");
    script.setAttribute("src", "/scripts/banner.js");
    script.async = false;   // halt rendering until writeBanner() is loaded?
    head.appendChild(script);
    //alert ("DL Done");
  }
  dynamicload();
</script> 

函数dynamicload(){
var head=document.getElementsByTagName(“head”)[0];
var script=document.createElement('script');
setAttribute(“type”、“text/javascript”);
setAttribute(“src”,“/scripts/banner.js”);
script.async=false;//在加载writeBanner()之前停止渲染?
head.appendChild(脚本);
//警报(“DL完成”);
}
dynamicload();
--当TAPP不是this.opener时,使用document.write()编写六个脚本

<script type="text/javascript"> 
  document.write('<SCR'+'IPT src="/scripts/banner.js '><\/SCR'+'IPT>');
  // and six more like it
</script> 


document.write(“您可以使用动态加载的代码将内容添加到当前页面。但是,您不能使用
document.write()
来执行此操作。您必须使用
.appendChild()
.insertBefore()
或对现有DOM元素设置
.innerHTML
等方法将DOM元素直接添加到页面

document.write()
的问题是,一旦页面被加载(从而文档流被关闭),以后对
document.write()
的任何调用都将清除当前页面并开始写入新的空白页面,这通常会破坏您正在尝试的操作

而且,当您动态加载代码时,它将在当前文档加载完成后加载


document.write()
用于在文档加载过程中在文档流的当前位置插入内容,只有当脚本以
标记的形式出现在原始HTML中,或者可以在全新文档上使用时,该功能才起作用(例如创建一个新的
iframe
或新的
窗口
)。

简单的答案。你不能

页面无法加载JS文件,其中包含写入页面其余部分所需的函数

无论您如何编写脚本来加载JS文件——使用DOM添加脚本元素,或使用document.write()将其写入——加载页面后,当写入页面为时已晚时,JS文件最终会被加载。(请参阅与nothingnecessarey的讨论。)

但是,如果我在脚本中抛出一个alert(),这两种条件方法都会起作用——DOM和document.write()——也就是说,我有标题!我所能想到的是,该警报会导致页面重新呈现自己,因为加载页面后会调用该警报,所以会加载JS文件

谢谢大家的帮助


事后思考:我梦见用iFrame打开一个空页面来加载我的二级页面可能会奏效。如果是这样,我会返回。如果不是这样,我就放弃。

如果你只是担心“每次打开任何一个二级页面时都会重新加载六个JS文件中的函数”那么,为什么不一直加载每个脚本并修改每个脚本文件以检查它是否已经加载和解析?一种方法是将每个脚本的内容包装在
if
块中,如下所示:
if(!window.scriptxxxloated){window.scriptxxxloated=true;…您现有的脚本…}
谢谢。但我认为它不会起作用。除非我错过了什么,