类script标签,异步加载,顺序执行

庞德
• 阅读 1824

主要是想实现把压缩加密后的js文件存储在本地,网上找了下没找到理想的,所以自己动手写了一个,主要是仿照script标签的功能,实现异步加载,顺序执行。如果本地已经有该文件,则不重新加载,直接调用本地数据。

jsFile是存储文件信息的数组,其中,path是文件路径,name是存储在本地的名字,active表示当前文件是否已经执行,load表示当前文件手已经加载完成,还要一个隐藏的content属性,存储文件内容。

!function loadJS(){
    var jsFile = [
        {name:'file1',path:'js/file1.js',active:false,load:false},
        {name:'file2',path:'js/file2.js',active:false,load:false},
        {name:'file3',path:'js/file3.js',active:false,load:false},
        {name:'file4',path:'js/file4.js',active:false,load:false},
        {name:'file5',path:'js/file5.js',active:false,load:false}
    ]
    jsFile.forEach(function(item, index){
        if(localStorage['file_' + item.name]){
            item.load = true
            implementJS(item, index)
        }else{
            $.ajax({
                type:"get",
                url:item.path,
                dataType:'text',
                success:function(data){
                    item.content = data
                    item.load = true
                    implementJS(item, index)
                }
            });
        }
    })

    function implementJS(item, index){
        //如果上一个文件已经执行了,则执行这个js文件
        if(index == 0 || jsFile[index - 1].active){
            storageJS(item, index)
            //尝试执行下一个js文件
            jsFile[index + 1] && jsFile[index + 1].load && implementJS(jsFile[index + 1], index + 1)
        }
    }
    function storageJS(item, index){
            //存储并执行js文件
            var name = 'file_' + item.name
            localStorage[name] = item.content || localStorage[name] || ''
            //这里要使用window.eval或者eval.call(window),否则eval里面的变量就不是全局变量
            window.eval(localStorage[name])
            item.active = true
    }
}()
点赞
收藏
评论区
推荐文章
美凌格栋栋酱 美凌格栋栋酱
6个月前
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
晴空闲云 晴空闲云
3年前
script使用integrity属性进行安全验证
script标签引入文件在html中,script标签可以通过src属性引入一个js文件,引入的js文件可以是本地的,也可以是远程的。1.引入本地文件开发环境一般多引入本地js文件。html2.引入远程文件部署到线上后,一般会分发到cdn,需要引入远程文件,形如:html只是引入远程文件存在一个问题,如果对应的文件被篡改了,那么可能会对用户造成影响。
Jacquelyn38 Jacquelyn38
4年前
在前端学习道路上,容易混淆的几个知识点!
async与deferasync:可选属性。表示应该立即下载脚本,但不应妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本。只对外部脚本文件有效(写在html文件中的js代码,添加此属性无效,仍按代码加载顺序执行)。defer:可选属性。标识脚本可以延迟到文档完全被解析和显示之后再执行。只对外部脚本文件有效。script标签属性async与
git常用命令
关注公众号QXF069克隆版本:gitclone path路径<directory 若默认则是文件的名字。查看远程版本库的地址  gitremotev|verbose将本地版本库和远程URL关联起来gitremoteaddtbranch<name(origin)<RepositoryU
Stella981 Stella981
3年前
Dockerfile 说明
1.基本说明  Dockfile是一个用于编写docker镜像生成过程的文件,其有特定的语法。在一个文件夹中,如果有一个名字为Dockfile的文件,其内容满足语法要求,在这个文件夹路径下执行命令:dockerbuildtagname:tag.,就可以按照描述构建一个镜像了。name是镜像的名称,tag是镜像的版本或者是标签号,
Wesley13 Wesley13
3年前
FLV文件格式
1.        FLV文件对齐方式FLV文件以大端对齐方式存放多字节整型。如存放数字无符号16位的数字300(0x012C),那么在FLV文件中存放的顺序是:|0x01|0x2C|。如果是无符号32位数字300(0x0000012C),那么在FLV文件中的存放顺序是:|0x00|0x00|0x00|0x01|0x2C。2.  
Stella981 Stella981
3年前
JavaScript模块化
前言:模块化开发需求在JS早期,使用script标签引入JS,会造成以下问题:1.加载的时候阻塞网页渲染,引入JS越多,阻塞时间越长。2.容易污染全局变量。3.js文件存在依赖关系,加载必须有顺序。项目较大时,依赖会错综复杂。4.引入的JS文件过多,不美观,且不易于管理。一、CommonJS规范
Stella981 Stella981
3年前
Datax的txtfilereader插件实践
一、介绍TxtFileReader提供了读取本地文件系统数据存储的能力。在底层实现上,TxtFileReader获取本地文件数据,并转换为DataX传输协议传递给Writer。二、配置模版{"setting":{},"job":{"setting":{
Stella981 Stella981
3年前
Javascript的加载
最新博客站点:欢迎来访(https://www.oschina.net/action/GoToLink?urlhttps%3A%2F%2Fwww.knightboy.cn%2F)1\.浏览器加载(1)同步加载    在网页中,浏览器加载js文件的方式是通过<script标签。如下所示://
Stella981 Stella981
3年前
NSUserDefaults轻量级本地存储数据
NSUserDefaults适合存储轻量级的本地数据,比如要保存一个登陆界面的数据,用户名、密码之类的,个人觉得使用NSUserDefaults是首选。下次再登陆的时候就可以直接从NSUserDefaults里面读取上次登陆的信息咯。因为如果使用自己建立的plist文件什么的,还得自己显示创建文件,读取文件,很麻烦,而是用NSUserDefaults则不
Wesley13 Wesley13
3年前
JS CSS 批量压缩工具,直接支持对项目操作
网上没找到合适的这样的工具.自己就写了一个,程序使用YUICompressor作为压缩引擎,最主要的是直接支持对项目进行操作,要对项目进行操作请一定要先将项目发布好,不要对开发的项目所在文件夹进行操作.软件很简单,就不介绍使用方式了,可以直接查看帮助.软件运行需要.Net3.5,如果你是win7就可以直接运行了.软件的特色是本地,可以批量压缩JS和