Pass Parameter in JavaScript-Funktion innerhalb von chrome.tabs.executeScript

Question

Ich baue eine Chrome-Erweiterung. In diesem Teil des Codes versuche ich, Absätze in der geladenen Seite zu finden, für jeden Absatz in divs mit Id laden und Details, ich suche, wenn Wert von findCheckedFact in diesem Absatz ist, wenn ja ich schneiden möchte ich diesen Text innerhalb einer Spanne mit eine Klasse rot.

findCheckedFact ist eine Zeichenfolge. Hier in +'console.log("Print:", str_p, " Fact:", findCheckedFact);' der Text innerhalb des Absatzes definiert ist, aber der Parameter findCheckedFact ist nicht definiert, also kann ich es nicht übergeben? Diese Funktion habe ich versucht findTextInsideParagraphs("test"); aufzurufen.

function findTextInsideParagraphs(findCheckedFact){ 
     chrome.tabs.executeScript({file: "js/jquery-1.12.0.min.js"}, function() { 
      chrome.tabs.executeScript({"code": 
       '(function(findCheckedFact){' 
        +'$("#lead, #detail").find("p").each(function() {' 
          +'var str_p = $(this).text();' 
          +'console.log("Print:", str_p, " Fact:", findCheckedFact);' 
          +'if (str_p.indexOf(findCheckedFact) >= 0) {' 
           +'console.log("Yes kest");' 
           +'$(this).html($(this).html().replace(findCheckedFact, "<span class=\'red\'> $& </span>"));' 
          +'}' 
        +'});' 
       +'}(' + JSON.stringify("Fact: " , findCheckedFact) + '));' 
      }); 
     }); 

} 

Diese Funktion habe ich versucht, findTextInsideParagraphs ("test") aufzurufen; Innen manifest.json ich every hinzufügen tat möglich, damit es funktioniert:

"content_scripts": [ 
    { 
     "matches": [ 
     "<all_urls>", 
     "http://*/*", 
     "https://*/*" 
     ], 
     "css": [ 
     "custom-css.css" 
     ], 
     "js": [ 
     "js/jquery-1.12.0.min.js" 
     ], 
     "run_at": "document_start" 
    }], 
    "background": { 
    "persistent": false, 
    "scripts": [ 
     "js/jquery-1.12.0.min.js", 
     "background.js", 
     "popup.js", 
     "blic-fact-checker.js" 
    ], 
    "css":["custom-css.css"] 
    }, 
    "permissions": [ 
    "background", 
    "notifications", 
    "contextMenus", 
    "storage", 
    "tabs", 
    "activeTab", 
    "http://localhost:5000/*", 
    "chrome-extension://genmdmadineagnhncmefadakpchajbkj/blic-fact-checker.js", 
    "chrome-devtools://devtools/bundled/inspector.html?&remoteBase=https://chrome-devtools-frontend.appspot.com/serve_file/@202161/&dockSide=undocked", 
    "http://*/*", 
    "https://*/*", 
    "<all_urls>" 
    ], 

jemand mir dabei helfen kann, kann ich wirklich nicht finden, was los ist?

Answer 1

Zuerst this explanation of different kinds of javascript code in Chrome extensions

lesen Wie Sie sehen, Ihr Code in executeScript ist ein Content-Skript, und es hat keinen direkten Zugriff auf den Code im Hintergrund und anderen geeigneten Erweiterungsseite. Sie haben 3 Hauptoptionen:

1) senden Sie Ihre FindCheckedFact an das Inhaltsskript mit sendMessage oder port.postMessage. Natürlich müssen Sie in Ihrem Inhaltsskript Listener für sie erstellen und den tatsächlichen Code in diese Listener einfügen.

2) Speichern Sie Ihre Variable im lokalen oder synchronen Speicher, setzen Sie Ihre executeScript in den Callback und lesen Sie sie aus Ihrem Inhaltsskript. Wenn Sie es manchmal erneut lesen müssen, legen Sie im Inhaltsskript einen Listener für die Speicheränderung fest.

Diese Lösungen funktionieren sowohl mit einem Inhaltsskript in einer JS-Datei als auch mit einem integrierten Inhaltsskript. Aber, da Sie wählen inlining, und Sie haben nur einen Wert ein Weg zu senden, können Sie

3) nur stringify Ihre FindCheckedFact (mit JSON.stringify oder toString), und legen Sie seinen Wert mit +:

chrome.tabs.executeScript({"code": 
      '(function('+strFindCheckedFact+'){' 

usw.