如何重载javascript文件

how to reload javascript file

本文关键字：javascript 文件 重载 何重载      更新时间：2023-09-26

我有一个关于重新加载JavaScript文件的问题。我开发网页前端，用JS写很多代码。每次当我想检查应用程序的流程是否正确(或做一些调试)时，我必须按F5键重新加载整个页面和脚本，我必须等待。等待的时间取决于页面的重量，有时我会不耐烦。因此，我想知道是否有任何方法重新加载仅更改脚本文件*.js ?或者也许有一些插件Chrome重新加载选定的脚本?这可能是一种非常方便的简化开发的方法。谢谢你的回复。

这个使用jQuery，在这里，例如:

var scs=$('script[type*=javascript]');
var scsl = scs.length;
var scsi = 0;
var o = [];
var oi = 0;
var ol = 0;
var s = '';
var fws = 0;
var sws = 0;
var v = {};
function i1(){
fws = window.setInterval(function(){
        v = $(scs[scsi]);
        
        s = v.attr('src');
        if(typeof s!='undefined' && s.indexOf('http')==-1 && s.indexOf('index')==-1){
                console.log([scsl,scsi,s]);
                o.push({src:s});
                v.remove();
        }
        if(scsi==scsl){
                console.log(o);
                window.clearInterval(fws);
                ol = o.length;
i2();
        }
        else{
                scsi++;
        }
},800);
}
function i2(){
                sws=window.setInterval(function(){
                        v = o[oi];
                        sc = $('<script>').attr({type:'text/javascript',src:v.src+'?t='+(new Date().getTime())});
                        console.log([ol,oi,v.src]);
                        $('head').append(sc);
                        if(oi==ol-1){
                                window.clearInterval(sws);
                        }
                        else{
                                oi++;
                        }
                },800);
}
i1();

据我所知，没有办法做到这一点。问题是，一旦求值，您就不能从页面中卸载脚本。

即使移除<script>节点，也不会改变行为。这可能是可能的一些第三方插件，例如，但我几乎可以肯定，这是不可能的任何香草js实现。

当然，您可以从服务器加载相同的脚本文件并执行(eval)它，但是，您仍然没有卸载之前的代码，这可能会导致非常意想不到的行为。

所以，你必须保持你的F5键的脚趾

你可以试试Firefox的新功能Scratchpad(我想从7.0版本开始就有了)。

当我在写一段新的javascript时，我会在草稿本上写，然后在我喜欢的时候复制给我的编辑器。基本上，我的所有工作都是在可以动态重新定义的函数和对象中完成的(不是每个人都这样吗?)这样我就可以重新运行函数定义或重新分配对象方法/数据，这比等待刷新周期要快得多。

在基于Dojo或CommonJS的框架中，这根本不是问题。Javascript代码通常保存在模块中。

在我们基于web的IDE中，我们总是像这样重新加载脚本(@reloadCustomMobileStack):

define([
    'dojo/_base/declare',
    'require'
], function(declare,require)
{
    return dojo.declare("xappstudio.manager.DynamicScriptMixin", null,
    {
        _reloadModule:function(module,reload)
        {
            require.undef(module);
            var scripts = document.getElementsByTagName('script');
            for (var i = scripts.length - 1; i >= 0; i--)
            {
                var script = scripts[i];
                if (script.getAttribute('src') && script.getAttribute('src').length > 0 && script.getAttribute('src').indexOf(module)!=-1)
                {
                    script.parentNode.removeChild(script);
                    break;
                }
            }
            if(reload)
            {
                require([module], function(_moduleIn)
                {
                    console.error('got module' + _moduleIn);
                });
            }
        },
        reloadCustomMobileStack:function()
        {
            var modulesToReload = [
                'cxapp/delegates/BootDelegate',
                'cxapp/delegates/FormDelegate',
                'cxapp/delegates/HeaderToolbarDelegate',
                'cxapp/delegates/ImageResizeDelegate',
                'cxapp/delegates/ServiceDelegate',
                'cxapp/delegates/UrlDelegate',
                'cxapp/manager/Context',
                'cxapp/manager/CustomApplication',
                'cxapp/manager/DataManager',
                'cxapp/types/Types',
                'cxapp/utils/RPCProxyPOSTEnvelope'
            ];
            for(var i = 0 ; i < modulesToReload.length ; i++)
            {
                this._reloadModule(modulesToReload[i],true);
            }
        }
     });
});

为了使用require.undef(module)，您需要将此添加到Dojo配置中:has:{'dojo-undef-api': true}

当然，这不会与任何Javascript工作，因为Dojo/Common-JS Javascript是不同的，但也允许你一种依赖注入或解析。

相关文章：