在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（）。

在Chrome中，您的最佳選擇可能是開發人員工具中“來源”下的“摘錄”標籤。

它將允許您編寫和運行代碼，例如，在about：空白頁面中。

在Chrome控制台中添加JavaScript文件

更新：

Share

Related

Tags