js 动态载入

最新推荐文章于 2022-08-25 20:30:37 发布

lq123456789000

最新推荐文章于 2022-08-25 20:30:37 发布

阅读量714

点赞数

分类专栏： java 文章标签： import path stylesheet function css module

本文链接：https://blog.csdn.net/lq123456789000/article/details/7615809

版权

java 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

使用ext的时候，往往需要载入太多的js文件，这些都写在main.jsp中，我自己都看的有点乱，所以就想到用动态引入js来显的好看点

main.jsp部分内容

<body>

.......

guild.js（引导文件）部分内容

/**
* 引导js
*/
function $import(path, type){
var scripts = document.getElementsByTagName("script");
var cssLinks = document.getElementsByTagName("link");
if(type=="css"){
for (i = 0; i < cssLinks.length; i++) {
if(cssLinks[i].href.match(path)){
return;
}
}
document.write("<" + "link href=\"" + path +"."+type+"\" rel=\"stylesheet\" type=\"text/css\"></" + "link>");
}else if(type=="js"||type=="gzjs"){
for (i = 0; i < scripts.length; i++) {
if(scripts[i].src.match(path)){
return;
}
}
document.write("<" + "script type=\"text/javascript\" src=\"" + path +"."+type+"\"></" + "script>");
}
}
$import("plugIn/ext3.2/resources/css/ext-all","css");
$import("css/main","css");
$import("css/menu","css");
$import("plugIn/ext3.2/ext-base","js");
$import("plugIn/ext3.2/ext-all","gzjs");
$import("js/common/ExtUtil","js");
$import("js/common/dominUtil","js");
$import("js/common/CommonUtil","js");

$import("js/component/MenuTree","js");

......

但以上方法有它的局限性，他无法保证各js文件执行的顺序，也没法保证其会执行，这样在比如ajax动态引入时候，常常报一些在上面定义过，却还报未定义的错误

这时候需要运用window.execScript和 eval.call的方法

部分代码如下

附部分代码

       loadModel: function(id,tab,path){
        //定义模块变量
        var model;

        if(this[id]){
            //如果模块类已存在，就直接实例化
            model = new this[id](tab);
        }else{
            this.loadMask.show();
            $importAjax('/js/core/userManager/core.js');
            Ext.Ajax.request({
                method:'GET',
                url: 'js/core/'+path+'/module.js',
                scope: this,
                success: function(response){
                    //获取模块类
                    this[id] = eval(response.responseText);
                    //实例化模块类
                    model = new this[id](tab);
                    this.loadMask.hide();
                }
            });
        }
    }

lq123456789000

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 动态载入

使用ext的时候，往往需要载入太多的js文件，这些都写在main.jsp中，我自己都看的有点乱，所以就想到用动态引入js来显的好看点main.jsp部分内容"/>首页.......guild.js（引导文件）部分内容/** * 引导js*/function $import(path, type){var scripts = do
复制链接

扫一扫