为什么我在 Chrome 扩展的选项卡的内容中找不到子字符串

Question

I'm implementing a Chrome extension.我正在实施 Chrome 扩展程序。 Need to find a particular string on the active tab.需要在活动选项卡上查找特定字符串。 But when I call "html.indexOf(stringToFind)" I get -1 instead.但是当我调用“html.indexOf(stringToFind)”时，我得到的是 -1。

Here are essential parts of my extension:以下是我的扩展的重要部分：

manifest.json manifest.json

{
    "manifest_version": 2,
    "name": "My Helper",
    "description": "My extension improves User Xperience",
    "version": "1.0",
    "page_action": {
        "default_popup": "popup.html",
        "default_icon": {
            "16": "images/get_started16.png",
            "32": "images/get_started32.png",
            "48": "images/get_started48.png",
            "128": "images/get_started128.png"
        }
    },
    "permissions": [
        "activeTab",
        "declarativeContent",
        "storage",
        "https://*.mysite.com/"
    ],
    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": false
    },
    "icons": {
        "16": "images/get_started16.png",
        "32": "images/get_started32.png",
        "48": "images/get_started48.png",
        "128": "images/get_started128.png"
    }
}

background.js (though I think this is not crucial to the particular problem, I'm presenting this for consistency). background.js （虽然我认为这对特定问题并不重要，但我提出这个是为了保持一致性）。

chrome.declarativeContent.onPageChanged.removeRules(undefined, function () {
  chrome.declarativeContent.onPageChanged.addRules([{
    conditions: [new chrome.declarativeContent.PageStateMatcher({
      pageUrl: { hostContains: '.mysite.com' },
    })
    ],
    actions: [new chrome.declarativeContent.ShowPageAction()]
  }]);
});

popup.html (only essential part) popup.html （仅必要部分）

<!DOCTYPE html>
<html>
  <head>
    <script src="popup.js"></script>
  </head>
  <body>
    <div id="StatusDiv">Here is a text section</div>
    <p>&nbsp;</p>
    <div id="ContentDiv">Content div... waiting for data</div>
  </body>
</html>

popup.js (only essential part) popup.js （仅重要部分）

function setContent(content) {
    document.getElementById('ContentDiv').innerText = content;
}
document.addEventListener('DOMContentLoaded', function () {

    chrome.tabs.query(
        { active: true, windowId: chrome.windows.WINDOW_ID_CURRENT },
        function (tabs) {
            var tab = tabs[0];
            console.debug("query, url: " + tab.url);

            chrome.tabs.executeScript(tab.Id,
                { code: 'document.querySelector("body").innerHTML' },
                function (html) {
                    console.debug("query:executeScript");

                    //html = `div id="background-outer" class="background-footer `;

                    let k = html.indexOf('background-outer', 0);
                    if (k != -1) {
                        console.debug('Found! k=' + k);
                    } else {
                        console.debug('Can\' find "report" action, k=' + k);
                    }
                
                    setContent(html);
                }
            );
        }
    );

});

As a result of this, I expect to find the position of the "background-outer" string in the HTML from the tab but my script can't find it.因此，我希望从选项卡中找到 HTML 中“背景外部”字符串的 position，但我的脚本找不到它。 At the same time, my 'setContent' function displays the HTML I pulled from the tab AND it contains the string I'm looking for.同时，我的“setContent”function 显示了我从选项卡中拉出的 HTML，它包含我正在寻找的字符串。

When I uncomment the string with the custom assignment of the snippet which contains code I'm looking for (so my 'html.indexOf(...)' works properly).当我使用包含我正在寻找的代码的片段的自定义分配取消注释字符串时（所以我的 'html.indexOf(...)' 工作正常）。

What is the problem?问题是什么？ The only idea I have is that it might be some issues with encoding, but I don't have much clue how to validate or fix that.我唯一的想法是编码可能存在一些问题，但我不知道如何验证或修复它。

Please advise, what I'm missing.请告知，我错过了什么。

Thanks!谢谢！

PS General hints on improving what I'm doing are also welcome. PS 关于改进我正在做的事情的一般提示也是受欢迎的。

Answer 1

Thanks to my friend I realized that the object passed into callback by executeScript is an array, not a string.感谢我的朋友，我意识到由 executeScript 传递给回调的 object 是一个数组，而不是一个字符串。

为什么我在 Chrome 扩展的选项卡的内容中找不到子字符串

问题描述

1 个解决方案

解决方案1
0 已采纳 2021-01-12 04:44:16

为什么我在 Chrome 扩展的选项卡的内容中找不到子字符串

问题描述

1 个解决方案

解决方案1 0 已采纳 2021-01-12 04:44:16

解决方案1
0 已采纳 2021-01-12 04:44:16