帝王谷资源网

用ajax动态加载需要的js文件
网络编程 2024/12/26 佚名
3 2
帝王谷资源网 Design By www.wdxyy.com

习惯了用java，在java中，需要某个类直接import就可以了，所以做javascript的时候也想实现这个效果。

　　前段时间，用了下dojo，里面的dojo.require的功能很不错，一看代码，晕了，一大堆东西，唉～还是自己写个简单点的，dojo.require可以引入包，我就只做一个导入js文件的。

　　开始用的document.write，执行顺序不对了，这是在后面进行导入，而我们总是在前面执行中就需要导入的js，这样，执行中就会报“某某未定义”，就是顺序问题了。

　　接着，我就想用ajax同步（注意：不是异步）调用远程js文件，这里有个问题，就是我们要js文件的时候，不是用绝对路径，就是相对路径，用相对路径的话，以哪个为参照呢？可以用调用js的那个文件为参照，也可以以实现调用功能的js文件为参照，这里，我选择写个 js，实现按需调用其它js，参照也选它。经过一番修改，路径问题解决。但是，读取过来的数据中文会有乱码问题，好在我们做东西都用UTF-8（因为要国际化），所以这里避过了。

　　远程js内容取到后，就要执行，用eval执行后，发现还是取不到远程js里定义的内容，怪了，猛alert一番后，发现执行eval的上下文范围有问题，我们要的是js在window对象中执行，嗯？window有什么方法没？一找，哈，有个window.execScript方法，ok，试一下，成功，yeah~后来发现在firefox下，不能用window.execScript，找了一下，用window.eval，用法和ie下的window.execScript类似。但是只用window.eval的时候，在ie下有时候会出问题，所以就两种一起用了。

　　下面是实现远程js安调用的那个js：env.js，我已经习惯用oo写js了

 /** 
 * @author zxub 2006-06-01 
 * 状态信息显示类，用var Status=new function()定义，可以静态引用其中的方法 
 * 一般情况下为function Status()，这样不能静态引用其中的方法，需要通过对象来引用 
 */ 
var Status=new function() 
{ 
  this.statusDiv=null; 
   
  /** 
   * 初始化状态显示层 
   */ 
  this.init=function() 
  { 
    if (this.statusDiv!=null) 
    { 
      return; 
    } 
    var body = document.getElementsByTagName("body")[0]; 
    var div = document.createElement("div"); 
    div.style.position = "absolute"; 
    div.style.top = "50%"; 
    div.style.left = "50%"; 
    div.style.width = "280px"; 
    div.style.margin = "-50px 0 0 -100px";     
    div.style.padding = "15px"; 
    div.style.backgroundColor = "#353555"; 
    div.style.border = "1px solid #CFCFFF"; 
    div.style.color = "#CFCFFF"; 
    div.style.fontSize = "14px"; 
    div.style.textAlign = "center"; 
    div.id = "status"; 
    body.appendChild(div); 
    div.style.display="none"; 
    this.statusDiv=document.getElementById("status"); 
  } 
   
  /** 
   * 设置状态信息 
   * @param _message:要显示的信息 
   */   
  this.showInfo=function(_message) 
  {    
    if (this.statusDiv==null) 
    { 
      this.init(); 
    }  
    this.setStatusShow(true); 
    this.statusDiv.innerHTML = _message;     
  } 
    
  /** 
   * 设置状态层是否显示 
   * @param _show:boolean值，true为显示，false为不显示 
   */  
  this.setStatusShow=function(_show) 
  {    
    if (this.statusDiv==null) 
    { 
      this.init(); 
    }  
    if (_show) 
    { 
      this.statusDiv.style.display=""; 
    } 
    else 
    { 
      this.statusDiv.innerHTML=""; 
      this.statusDiv.style.display="none"; 
    } 
  } 
} 

/** 
 * @author zxub 
 * 用于存放通道名称及通信对象的类，这样可以通过不同通道名称来区分不同的通信对象 
 */ 
function HttpRequestObject() 
{ 
  this.chunnel=null; 
  this.instance=null; 
} 

/** 
 * @author zxub 
 * 通信处理类，可以静态引用其中的方法 
 */ 
var Request=new function() 
{ 
  this.showStatus=true; 
   
  //通信类的缓存 
  this.httpRequestCache=new Array(); 
   
  /** 
   * 创建新的通信对象 
   * @return 一个新的通信对象 
   */ 
  this.createInstance=function() 
  { 
    var instance=null; 
    if (window.XMLHttpRequest) 
    { 
      //mozilla 
      instance=new XMLHttpRequest(); 
      //有些版本的Mozilla浏览器处理服务器返回的未包含XML mime-type头部信息的内容时会出错。因此，要确保返回的内容包含text/xml信息 
      if (instance.overrideMimeType) 
      { 
        instance.overrideMimeType="text/xml"; 
      } 
    } 
    else if (window.ActiveXObject) 
    { 
      //IE 
      var MSXML = ['MSXML2.XMLHTTP.5.0', 'Microsoft.XMLHTTP', 'MSXML2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP']; 
      for(var i = 0; i < MSXML.length; i++) 
      { 
        try 
        { 
          instance = new ActiveXObject(MSXML[i]); 
          break; 
        } 
        catch(e) 
        {           
        } 
      } 
    } 
    return instance; 
  } 
   
  /** 
   * 获取一个通信对象 
   * 若没指定通道名称，则默认通道名为"default" 
   * 若缓存中不存在需要的通信类，则创建一个，同时放入通信类缓存中 
   * @param _chunnel：通道名称，若不存在此参数，则默认为"default" 
   * @return 一个通信对象，其存放于通信类缓存中 
   */ 
  this.getInstance=function(_chunnel) 
  { 
    var instance=null; 
    var object=null; 
    if (_chunnel==undefined)//没指定通道名称 
    { 
      _chunnel="default"; 
    } 
    var getOne=false; 
    for(var i=0; i<this.httpRequestCache; i++) 
    { 
      object=HttpRequestObject(this.httpRequestCache[i]); 
      if (object.chunnel==_chunnel) 
      { 
        if (object.instance.readyState==0 || object.instance.readyState==4) 
        { 
          instance=object.instance; 
        } 
        getOne=true; 
        break;           
      } 
    } 
    if (!getOne) //对象不在缓存中，则创建 
    { 
      object=new HttpRequestObject(); 
      object.chunnel=_chunnel; 
      object.instance=this.createInstance(); 
      this.httpRequestCache.push(object); 
      instance=object.instance; 
    }      
    return instance; 
  } 
   
  /** 
   * 客户端向服务端发送请求 
   * @param _url:请求目的 
   * @param _data:要发送的数据 
   * @param _processRequest:用于处理返回结果的函数，其定义可以在别的地方，需要有一个参数，即要处理的通信对象 
   * @param _chunnel:通道名称，默认为"default" 
   * @param _asynchronous:是否异步处理，默认为true,即异步处理 
   */ 
  this.send=function(_url,_data,_processRequest,_chunnel,_asynchronous) 
  { 
    if (_url.length==0 || _url.indexOf("")==0) 
    { 
      Status.showInfo("由于目的为空，请求失败，请检查！"); 
      window.setTimeout("Status.setStatusShow(false)",3000); 
      return; 
    } 
    if (this.showStatus) 
    { 
      Status.showInfo("请求处理中，请稍候");  
    } 
    if (_chunnel==undefined || _chunnel=="") 
    { 
      _chunnel="default"; 
    } 
    if (_asynchronous==undefined) 
    { 
      _asynchronous=true; 
    } 
    var instance=this.getInstance(_chunnel); 
    if (instance==null) 
    { 
      Status.showInfo("浏览器不支持ajax，请检查！") 
      window.setTimeout("Status.setStatusShow(false)",3000); 
      return; 
    }  
    if (_asynchronous==true && typeof(_processRequest)=="function") 
    { 
      instance.onreadystatechange=function() 
      { 
        if (instance.readyState == 4) // 判断对象状态 
        { 
          if (instance.status == 200) // 信息已经成功返回，开始处理信息 
          {          
            _processRequest(instance); 
            Status.setStatusShow(false); 
            Request.showStatus=true;           
          } 
          else 
          { 
            Status.showInfo("您所请求的页面有异常，请检查！"); 
            window.setTimeout("Status.setStatusShow(false)",3000); 
          } 
        } 
      } 
    } 
    //_url加一个时刻改变的参数，防止由于被浏览器缓存后同样的请求不向服务器发送请求 
    if (_url.indexOf("")!=-1) 
    { 
      _url+="&requestTime="+(new Date()).getTime(); 
    } 
    else 
    { 
      _url+=""+(new Date()).getTime(); 
    } 
    if (_data.length==0) 
    { 
      instance.open("GET",_url,_asynchronous);      
      instance.send(null);       
    } 
    else 
    { 
      instance.open("POST",_url,_asynchronous); 
      instance.setRequestHeader("Content-Length",_data.length); 
      instance.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 
      instance.send(_data); 
    } 
    if (_asynchronous==false && typeof(_processRequest)=="function") 
    { 
      _processRequest(instance); 
      if (Request.showStatus) 
      { 
        Status.setStatusShow(false); 
      } 
      else 
      { 
        Request.showStatus=true; 
      } 
    } 
  } 
   
  /** 
   * 间隔一段时间持续发送请求，只用于异步处理，只用于GET方式 
   * @param _interval:请求间隔，以毫秒计 
   * @param _url:请求地址 
   * @param _processRequest:用于处理返回结果的函数，其定义可以在别的地方，需要有一个参数，即要处理的通信对象 
   * @param _chunnel:通道名称，默认为"defaultInterval"，非必添 
   */ 
  this.intervalSend=function(_interval,_url,_processRequest,_chunnel) 
  { 
    var action=function() 
    { 
      if (_chunnel==undefined) 
      { 
        _chunnel="defaultInterval"; 
      } 
      var instance=Request.getInstance(_chunnel); 
      if (instance==null) 
      { 
        Status.showInfo("浏览器不支持ajax，请检查！") 
        window.setTimeout("Status.setStatusShow(false)",3000); 
        return; 
      } 
      if (typeof(_processRequest)=="function") 
      { 
        instance.onreadystatechange=function() 
        { 
          if (instance.readyState == 4) // 判断对象状态 
          { 
            if (instance.status == 200) // 信息已经成功返回，开始处理信息 
            { 
              _processRequest(instance); 
            } 
            else 
            { 
              Status.showInfo("您所请求的页面有异常，请检查！"); 
              window.setTimeout("Status.setStatusShow(false)",3000); 
            } 
          } 
        } 
      } 
      //_url加一个时刻改变的参数，防止由于被浏览器缓存后同样的请求不向服务器发送请求 
      if (_url.indexOf("")!=-1) 
      { 
        _url+="&requestTime="+(new Date()).getTime(); 
      } 
      else 
      { 
        _url+=""+(new Date()).getTime(); 
      } 
      instance.open("GET",_url,true); 
      instance.send(null); 
    } 
    window.setInterval(action,_interval);     
  } 
} 

var Env=new function() 
{   
  this.funcList=new Array(); 
     
  this.envPath=null; 
   
  this.getPath=function() 
  { 
    this.envPath=document.location.pathname; 
    this.envPath=this.envPath.substring(0,this.envPath.lastIndexOf("/")+1);     
    var _scripts=document.getElementsByTagName("script"); 
    var _envPath=null; 
    var _scriptSrc=null; 
    for (var i=0; i<_scripts.length; i++) 
    { 
      _scriptSrc=_scripts[i].getAttribute("src"); 
      if (_scriptSrc && _scriptSrc.indexOf("env.js")!=-1) 
      { 
        break; 
      } 
    } 
    if (_scriptSrc!=null) 
    { 
      if (_scriptSrc.charAt(0)=='/') 
      { 
        this.envPath=_scriptSrc.substr(0,_scriptSrc.length-6); 
      } 
      else 
      { 
        this.envPath=this.envPath+_scriptSrc.substr(0,_scriptSrc.length-6); 
      } 
    }     
  } 
  this.getPath();   
   
  /** 
   * 按需获取需要的js文件 
   * @param _jsName：js文件路径，若为相对路径，则是对应env.js的相对路径，也可以用绝对路径 
   * @param _language:对返回函数进行处理的语言，默认为JScript，可不填 
   */ 
  this.require=function(_jsName,_language) 
  { 
    var _absJsName=null; 
    if (_jsName.charAt(0)=='/') 
    { 
      _absJsName=_jsName; 
    } 
    else 
    { 
      _absJsName=this.envPath+_jsName; 
    }     
    if (!Env.funcList[_absJsName]) 
    { 
      Env.funcList[_absJsName]="finished";  
      var processJs=function(_instance) 
      { 
        //为兼容firefox做判断 
        if (_language!=undefined) 
        { 
          if (window.execScript) 
          { 
            window.execScript(_instance.responseText,_language); 
          } 
          else 
          { 
            window.eval(_instance.responseText,_language); 
          }                     
        } 
        else 
        { 
          if (window.execScript) 
          { 
            window.execScript(_instance.responseText); 
          } 
          else 
          { 
            window.eval(_instance.responseText); 
          }           
        }         
      } 
      Request.showStatus=false; 
      Request.send(_absJsName,"",processJs,"",false); 
    } 
  } 
   
  /** 
   * 该函数的效果是在应用它的script块后加一个script块 
   * 是由document.write在script块中的执行顺序决定的 
   */ 
  this.getJs=function(_jsName) 
  { 
    if (!Env.funcList[_jsName]) 
    { 
      Env.funcList[_jsName]="finished"; 
      document.write('<scr'+'ipt type="text/javascript" src="/UploadFiles/2021-04-02/'+_jsName+'">


需要引用别的js的时候，就加上如Env.require("cookie.js")，或Env.require("/common/cookie.js")，是用相对路径还是绝对路径就看喜好了，Env.require可用在页面模板中，也可用在js文件中，但一定要保证执行时env.js被显式引入。多次Env.require同一个js（不管用相对还是绝对），只有第一次会加载，所以不会重复。 




　　按个人应用不一样，可以修改一点，主体思想就这样了。
标签：
ajax,加载js
帝王谷资源网 Design By www.wdxyy.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站文章均来自网站采集或用户投稿，网站不提供任何软件下载或自行开发的软件！ 如有用户或公司发现本站内容信息存在侵权行为，请邮件告知！ 858582#qq.com
帝王谷资源网 Design By www.wdxyy.com
www.wdxyy.com 帝王谷资源网
139,976互联网资源
144,792高清电影
21,817无损音乐
631,128技术资源

P70系列延期，华为新旗舰将在下月发布

3月20日消息，近期博主@数码闲聊站 透露，原定三月份发布的华为新旗舰P70系列延期发布，预计4月份上市。

而博主@定焦数码 爆料，华为的P70系列在定位上已经超过了Mate60，成为了重要的旗舰系列之一。它肩负着重返影像领域顶尖的使命。那么这次P70会带来哪些令人惊艳的创新呢？

根据目前爆料的消息来看，华为P70系列将推出三个版本，其中P70和P70 Pro采用了三角形的摄像头模组设计，而P70 Art则采用了与上一代P60 Art相似的不规则形状设计。这样的外观是否好看见仁见智，但辨识度绝对拉满。

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接