Question

我正在进行扩展，将页面上所有div的背景颜色更改为红色，但控件不会传递给内容脚本。使用开发人员工具我可以在background.js和popup.js中设置断点，但不能在content.js中设置断点，所以我使用了console.log，但它没有执行plz帮助

popup.html

<!DOCTYPE html>
<html>
<head>
<script src="popup.js"></script>
</head>
<body>

<button id="change-btn">Change color of Divs</button>

</body>    
</html>

popup.js

window.onload=init;

function init(){

    var btn=document.getElementById("change-btn");
    btn.onclick = function(){

        chrome.runtime.sendMessage({type:"color-div" });
     }

};

background.js

chrome.runtime.onMessage.addListener(function(request, sender, response){

     if(request.type==="color-div"){

         colordiv();

     }
});



function colordiv(){
    chrome.tabs.query({ active:true, currentWindow:true} , function(tab){
        chrome.tabs.sendMessage( tab[0].id, {type: "colors-div", color: "#F00"});

    });
};

content.js

chrome.runtime.onMessage.addListener(function(request, sender, response){
        if(request.type==="colors-div"){
            var divs= document.querySelectorAll("div");
            if(divs.length===0)
                alert("There r no divs on this page ");
            else{
                console.log("Before for loop");
                for(var i=0; i<divs.length; i++)
                {
                    divs[i].style.backgroundColor=request.color;
                }
                console.log("After for loop");
            }
        }
    });

的manifest.json

{
    "name": "BrowserExtension",
    "version": "0.0.1",
    "manifest_version": 2,
    "description" : "Description ...",
     "content_scripts": [{
        "matches": ["http://*/*", "https://*/*"],
        "js": ["content.js"]
    }],
    "browser_action": {
        "default_icon": "icon.png",
        "default_title": "That's the tool tip",
        "default_popup": "popup.html"
    },
    "background": {
        "scripts": ["background.js"],
        "persistent": false
    },
    "permissions":["tabs"]

}

Answer 1

此代码适用于我，当我打开开发人员工具时，console.log语句显示在页面的Javascript控制台中。确保刷新了目标选项卡，以便注入内容脚本，并注意不会将此脚本注入本地HTML文档，因为＆＃34; file：/// *＆＃34;不是为内容脚本指定的匹配规则之一。

内容脚本没有执行..（它没有收到后台发送的消息）

1 个答案: