在Chrome控制台中添加JavaScript文件


Answers

你使用一些AJAX框架? 使用jQuery,它將是:

$.getScript('script.js');

如果你沒有使用任何框架,那麼請看Harmen的答案。

(也許這是不值得使用jQuery來完成這一件簡單的事情( 或者它可能是這樣 ),但如果你已經加載了它,那麼你也可以使用它。我看到過有jQuery加載的網站,例如Bootstrap,但仍然直接使用DOM API並不總是可移植的,而不是使用已經加載的jQuery,很多人都沒有意識到即使getElementById()在所有瀏覽器上都不能一致地工作 - 看到這個答案了解詳情。)

更新:

我寫了這個答案已經有好幾年了,我認為值得在這裡指出,今天你可以使用:

動態加載腳本。 這些可能與閱讀這個問題的人有關。

另請參閱: Guy Bedford的Fluent 2014演講:ES6模塊的實用工作流程

Question

在Google Chrome瀏覽器中包含外部腳本文件是否有更簡單的(本地或許?)方法?

目前我正在這樣做:

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



作為上文 @ maciej-bukowski答案的後續答案,截至目前為止(2017年春季)的現代瀏覽器支持異步/等待您可以加載,如下所示。 在這個例子中,我們加載加載html2canvas庫:

async function loadScript(url) {
  let response = await fetch(url);
  let script = await response.text();
  eval(script);
}

let scriptUrl = 'https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js'
loadScript(scriptUrl);

如果您運行該代碼段然後打開瀏覽器的控制台,您應該看到現在定義了函數html2canvas()。







Links