有條件地加載JavaScript腳本

Question

我有一個帶有設置頁面的Chrome擴展程序。 在設置頁面中，我想要預覽和保存按鈕。 我希望能夠將臨時選項對象傳遞給我的APPLICATION。 我該怎么做，這樣我就不必兩次重寫APPLICATION了？ 如何將信息傳遞給html頁面，這一次它應該訪問LocalStorage ['permanent_settings']和其他LocalStorage ['temporary_settings']，並使用該對象作為設置對象來呈現內容。 我也希望我的代碼在本地執行，所以我不需要任何PHP等。

Answer 1

您可以將條件添加到此方法，該方法允許您動態添加外部javascript文件：

loadExternalScriptFile = function(filename) {
    var fileref = document.createElement("script");
    if (fileref){
        fileref.setAttribute("type","text/javascript");
        fileref.setAttribute("src", filename);        
        if (typeof fileref != "undefined")
            document.getElementsByTagName("head")[0].appendChild(fileref);
    }
}

//dynamically load and add this .js file
loadExternalScriptFile("myscript.js");     

Answer 2

您還應該嘗試將讀取源也保存在本地存儲中，類似於：

// At startup, defaulting to permanent_settings
function onLoad() {
  LocalStorage['read_from'] = 'permanent_settings';

  // Other initialization work
  // ...
}

// When pressing Save
function onSaveClick() {
  LocalStorage['read_from'] = 'permanent_settings';
}

// When pressing Preview
function onPreviewClick() {
   LocalStorage['read_from'] = 'temporary_settings';
}

// When accessing the settings, read their source
function getSettingForKey(var key) {
   var source = LocalStorage['read_from'];

   // It can be either permanent_settings, or temporary_settings
   var settingsArray = LocalStorage[source];

   return settingsArray[key];
}

Answer 3

您可以使用jQuery加載腳本，甚至在加載腳本時執行代碼。 您甚至不必將代碼包裝在$(function(){ ... })塊中：

$.getScript(chrome.extension.getURL("myscript.js"), function() {
    alert("myscript.js has finished loading");
});