有没有一个更简单的(本机也许?)方法,包括一个外部脚本文件在谷歌Chrome浏览器?

目前我是这样做的:

document.head.innerHTML += '<script src="http://example.com/file.js"></script>';

当前回答

作为上面@maciej-bukowski的回答^^^的后续,在目前(2017年春季)支持async/await的现代浏览器中,您可以按以下方式加载。在这个例子中,我们加载了load html2canvas库:

异步函数loadScript(url) { Let response = await fetch(url); Let script = await response.text(); eval(脚本); } 让scriptUrl = 'https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js' loadScript (scriptUrl);

如果你运行这个代码片段,然后打开浏览器的控制台,你会看到html2canvas()函数现在已经定义了。

其他回答

安装tampermonkey并添加以下UserScript,带有一个(或多个)@match和特定页面url(或所有页面的匹配:https://*)):

// ==UserScript==
// @name         inject-rx
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Inject rx library on the page
// @author       Me
// @match        https://www.some-website.com/*
// @require      https://cdnjs.cloudflare.com/ajax/libs/rxjs/6.5.4/rxjs.umd.min.js
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
     window.injectedRx = rxjs;
     //Or even:  window.rxjs = rxjs;

})();

当您需要控制台中或代码片段上的库时,请启用特定的UserScript并刷新。

这种解决方案可以防止名称空间污染。您可以使用自定义名称空间来避免意外覆盖页面上现有的全局变量。

作为上面@maciej-bukowski的回答^^^的后续,在目前(2017年春季)支持async/await的现代浏览器中,您可以按以下方式加载。在这个例子中,我们加载了load html2canvas库:

异步函数loadScript(url) { Let response = await fetch(url); Let script = await response.text(); eval(脚本); } 让scriptUrl = 'https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js' loadScript (scriptUrl);

如果你运行这个代码片段,然后打开浏览器的控制台,你会看到html2canvas()函数现在已经定义了。

如果你刚开始学习javascript,不想花时间创建一个完整的网页,只是为了嵌入测试脚本,只需在Chrome浏览器的新选项卡中打开开发工具,然后单击控制台。

然后输入一些测试脚本:例如。

console.log('Aha!') 

然后在每一行后按Enter(由Chrome提交执行)

或者加载你自己的“外部脚本文件”:

document.createElement('script').src = 'http://example.com/file.js';

然后调用你的函数:

console.log(file.function('驨ꍬ啯ꍲᕤ'))

测试在谷歌Chrome 85.0.4183.121

appendChild()是一种更原生的方式:

var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'script.js';
document.head.appendChild(script);

你是否使用AJAX框架?使用jQuery它将是:

$.getScript('script.js');

如果您不使用任何框架,请参阅Harmen的答案。

(也许用jQuery来做这个简单的事情是不值得的(也许是值得的),但如果你已经加载了它,那么你不妨使用它。我见过一些网站加载了jQuery,例如Bootstrap,但仍然直接使用DOM API,这种方式并不总是可移植的,而不是使用已经加载的jQuery,许多人都没有意识到getElementById()在所有浏览器上都不能一致工作的事实-详情请参阅这个答案。)

更新:

我写这个答案已经有很多年了,我认为值得在这里指出的是,今天你可以使用:

SystemJS ModuleLoader jspm.io

动态加载脚本。这些可能与阅读这个问题的人有关。

参见Guy Bedford的Fluent 2014演讲:ES6模块的实际工作流程。