有没有办法在浏览器中"热插拔"JavaScript代码?

kol*_*rie 16 javascript debugging frameworks

是否有任何工具可以让您在执行网页时"热插拔"JavaScript内容?

我正在寻找类似于HotSpot为Java做的事情,这是一种"热部署"新JS代码而无需重新加载整个页面的方法.

那里有类似的东西吗?

澄清如果人们不理解"热插拔",如锁定所示:

通过"热交换",我的意思是允许我更改页面本身及其.js文件中包含的部分代码.

然后,这个框架将检测到更改 - 无论是自动还是通过我的结束的一些指示 - 并动态重新加载代码,避免新的服务器端发布(重新加载).

这种方法可以简化调试和错误修复,因为您不需要重新加载页面并从头开始重新开始交互.

Erl*_*sen 4

有趣的想法:)

我写了以下书签:

function reload(){var scripts=document.getElementsByTagName("script");var head=document.getElementsByTagName("head")[0];var newScripts=[];var removeScripts=[];for(var i=0;i<scripts.length;i++){var parent=scripts[i].parentNode;if(parent==head&&scripts[i].src){var newScript={};newScript.src=scripts[i].src;newScript.innerHTML=scripts[i].innerHTML;newScripts.push(newScript);removeScripts.push(scripts[i]);}}for(var i=0;i<removeScripts.length;i++){head.removeChild(removeScripts[i]);}for(var i=0;i<newScripts.length;i++){var script=document.createElement("script");script.src=newScripts[i].src;script.type="text/javascript";script.innerHTML=newScripts[i].innerHTML;head.appendChild(script);}}
Run Code Online (Sandbox Code Playgroud)

将其添加到新书签的位置,它将重新加载 <head> 中引用的所有 JavaScript。不确定这在实践中效果如何,但值得一试:)我想您在编写脚本时必须非常小心,以免多次将内容添加到页面正文中,也许对“reload =“true””属性的支持可能很有用,这样您就可以仅将您的库标记为可重新加载。

完整来源:

function reload() {
    var scripts = document.getElementsByTagName("script");
    var head = document.getElementsByTagName("head")[0];
    var newScripts = [];
    var removeScripts = [];
    for(var i=0; i < scripts.length; i++) {
        var parent = scripts[i].parentNode;
        if(parent == head && scripts[i].src) {
            var newScript = {};
            newScript.src = scripts[i].src;
            newScript.innerHTML = scripts[i].innerHTML;
            newScripts.push(newScript);
            removeScripts.push(scripts[i]);
        }
    }

    for(var i=0; i < removeScripts.length; i++) {
        head.removeChild(removeScripts[i]);
    }

    for(var i=0; i < newScripts.length; i++) {
        var script = document.createElement("script");
        script.src = newScripts[i].src;
        script.type = "text/javascript";
        script.innerHTML = newScripts[i].innerHTML;
        head.appendChild(script);
    }
}
Run Code Online (Sandbox Code Playgroud)