Javascript 遍历选项卡以搜索字符串_Javascript_Jquery_Html_Google Chrome Extension

Javascript 遍历选项卡以搜索字符串

javascript jquery html google-chrome-extension

Javascript 遍历选项卡以搜索字符串,javascript,jquery,html,google-chrome-extension,Javascript,Jquery,Html,Google Chrome Extension,我正在为Chrome扩展开发一个函数，我需要一些调试帮助函数应该从popup.html文本框中获取用户的字符串输入，并查看当前窗口中的所有选项卡，以查看任何选项卡中是否存在字符串输入。最后，我给出一个警报，告诉用户在哪个选项卡（索引：0，1，…）中找到了字符串 background.js //searches all tabs for the input string function searchEverywhere(searchString) { var indices = [];

我正在为Chrome扩展开发一个函数，我需要一些调试帮助

函数应该从popup.html文本框中获取用户的字符串输入，并查看当前窗口中的所有选项卡，以查看任何选项卡中是否存在字符串输入。最后，我给出一个警报，告诉用户在哪个选项卡（索引：0，1，…）中找到了字符串

background.js

//searches all tabs for the input string
function searchEverywhere(searchString) {
    var indices = [];
    chrome.tabs.query({}, function(tabs) {
        var numOfTabs = tabs.length;
        for(i = 0; i < numOfTabs; i++) {
            chrome.tabs.update(tabs[i].id, updateProperties, function(tab) {
                if(getText().indexOf(searchString) > -1) {
                    indices.push(i);
                }
            }); 
        }
    });
    return indices;
}
function makeAlert(pagesFound) {
    alert("Your input was found on tabs: " + pagesFound.toString());
}
function getText() {
    return document.body.innerText;
}

popup.html

<!DOCTYPE html>
<html>
    <head>
        <title>Work with tabs</title>
        <script src="popup_script.js"></script>
    </head>
    <body><div class="searchEverywhere">
        Search all tabs for word:<br>
            <input type="text" name="textToSearch" id="textToSearch">
            <br>
            <input type="button" id="btnSearch" value="Search">
        </div>

    </body>
</html>


使用选项卡
在所有选项卡中搜索单词：

使用，我们可以检索选项卡的

内部文本
background.js
function searchEverywhere(searchPhrase, callback) {
    chrome.tabs.query({
        //query only tabs that you have enabled permissions for or you will get errors in console
    }, tabs => {
        let foundInTabIds = [];

        for (let tab of tabs) {
            chrome.tabs.executeScript(tab.id, {
                code: `document.body.innerText`
            }, (results => {
                if (results && results.length > 0) {
                    let tabText = results[0];
                    if(tabText.indexOf(searchPhrase) > -1) {
                        foundInTabIds.push(tab.id);
                    }
                }
            }));
        }

        setTimeout(() => {
            //your alert
            callback(foundInTabIds);
        }, 2000);
    });
}

...

var pagesFound = backgroundPage
    .searchEverywhere(String(searchString.value), backgroundPage.makeAlert);

...

popup.js
function searchEverywhere(searchPhrase, callback) {
    chrome.tabs.query({
        //query only tabs that you have enabled permissions for or you will get errors in console
    }, tabs => {
        let foundInTabIds = [];

        for (let tab of tabs) {
            chrome.tabs.executeScript(tab.id, {
                code: `document.body.innerText`
            }, (results => {
                if (results && results.length > 0) {
                    let tabText = results[0];
                    if(tabText.indexOf(searchPhrase) > -1) {
                        foundInTabIds.push(tab.id);
                    }
                }
            }));
        }

        setTimeout(() => {
            //your alert
            callback(foundInTabIds);
        }, 2000);
    });
}

...

var pagesFound = backgroundPage
    .searchEverywhere(String(searchString.value), backgroundPage.makeAlert);

...

为了简单起见，我使用了setTimeout
，但这不是等待所有回调完成的最佳方式。我建议使用promises。
您的getText（）
函数始终获取背景页的文本。它需要获取每个选项卡的文本。如何获取每个选项卡的文本？我已经添加了一个完整的答案。感谢您的尝试，但此代码不起作用，还破坏了扩展名>文档中的其他函数。正文。innerText
返回一个字符串：因此，让tabText=results[0]
仅获取第一个字符。删除该行并将tabText.indexOf…
替换为results.indexOf…
我对其进行了编辑以适应您的代码@伊凡诺科诺科，没有。