重新加载JavaScript文件而不刷新HTML

重新加载JavaScript文件而不刷新HTML,javascript,html,Javascript,Html,我有一个加载多个Javascript文件的HTML: <script src="assets/js/a.js"></script> <script src="assets/js/b.js"></script> <script src="assets/js/jquery.min.js"></script> 当我在浏览器控制台中调试/测试Java脚本时,是否有可能在不需要重新加载整个HTML页面的情况下重新加载这些Java

我有一个加载多个Javascript文件的HTML:

<script src="assets/js/a.js"></script>
<script src="assets/js/b.js"></script>
<script src="assets/js/jquery.min.js"></script>

当我在浏览器控制台中调试/测试Java脚本时,是否有可能在不需要重新加载整个HTML页面的情况下重新加载这些Javascript文件?

没有(至少没有黑客),事实上-重新加载这么多时要非常小心。很有可能您的Javascript被缓存,这会导致许多头痛的调试尝试,因为您的更新没有应用


您可以删除它们,然后重新添加它们:

$('script').each(function() {
    if ($(this).attr('src') !== 'assets/js/jquery.min.js') {
        var old_src = $(this).attr('src');
        $(this).attr('src', '');
        setTimeout(function(){ $(this).attr('src', old_src + '?'+new Date()); }, 250);
    }
});

使用jQuery 2.0.3和chrome 43进行测试

 function reloadScript(id) {

    var $el =  $('#' + id);

    $('#' + id).replaceWith('<script id="' + id + '" src="' + $el.prop('src') + '"><\/script>');
}

不会删除事件侦听器,因此,例如,按钮单击在重新加载一次时会执行两次。

基于PitaJ的解决方案

在函数中重新加载所有javascript。你可以在任何地方打电话

 $('script').each(function () {
        if ($(this).attr('src') != undefined && $(this).attr('src').lastIndexOf('jquery') == -1) {
            var old_src = $(this).attr('src');
            var that = $(this);
            $(this).attr('src', '');

            setTimeout(function () {
                that.attr('src', old_src + '?' + new Date().getTime());
            }, 250);
        }
    });

如果正在调试,则需要调试用户体验。如果您只是重新加载一个脚本,那么您是从一个不同的上下文开始的,而用户会这样做。因此,在调试时重新加载整个HTML并不是一件坏事。好问题。但它已经被问到和回答了。感谢所有的回答和评论。我认为调试过程中的问题更糟:使用Ctrl+F5重新加载HTML无法重新加载任何资产文件,例如可能已更改的.JS文件。您可以始终使用Ctrl+F5重新加载,这将刷新cache@Truth-他在问题代码中有一个jquery脚本元素+1来否定-1@真相:3并不意味着全部:)至少在StackOverflow:)但PitaJ您的代码有缺陷。1.setTimeout在此代码中不会执行任何操作。2.更重要的是,替换脚本在这里不起作用。您只能添加一个新脚本,我想您指的是Date.now()而不是new Date()
 $('script').each(function () {
        if ($(this).attr('src') != undefined && $(this).attr('src').lastIndexOf('jquery') == -1) {
            var old_src = $(this).attr('src');
            var that = $(this);
            $(this).attr('src', '');

            setTimeout(function () {
                that.attr('src', old_src + '?' + new Date().getTime());
            }, 250);
        }
    });