Chrome开发工具 - 无需重新加载网页即可获取javascript文件

Question

我一直试图在Chrome开发工具中找到重新加载javascript文件的方法，而无需重新加载整个网页。搜索谷歌和SO，但到目前为止没有运气。

用例是我有一个购物车表格，有5个步骤完成购买。更新javascript文件后，我不想重新加载页面并输入步骤1到步骤5的所有信息，看看它是否有效。这非常耗时。

任何有此工具经验的人都可以帮忙！

Answer 1

您可以通过在控制台中获取脚本，创建脚本元素，将脚本内容设置为您提取的文本，然后将新脚本元素插入到文档中来执行此操作

fetch('https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.core.js').then(response => {
    return response.text();
}).then(text => {
    let s = document.createElement('script');
    s.textContent = text;
    document.head.appendChild(s);
});

例如，假设我想从我的页面运行Lodash库，通常通过调用_来完成（就像你如何调用$来使用jQuery）。在GIF中单击按钮时，它只执行console.log(_)。我第一次点击时，控制台说_未定义。运行代码后，_成功指向Lodash库。

如果您的网页包含大量iframe，请确保将库插入正确的文档中。这就是我从Context Selector dropdown menu中选择fiddle.jshell.net的原因。