Chrome擴展 - 注入的CSS在瀏覽器的操作頁面點擊

我知道如何使用這種方法https://stackoverflow.com/a/7619104/1157283 Chrome擴展 - 注入的CSS在瀏覽器的操作頁面點擊

但是，如果我只希望它被注入到這些網頁時，瀏覽器的行動就是注入CSS到指定的URL點擊？我正在閱讀關於程序化注入http://developer.chrome.com/extensions/content_scripts.html#pi，這使得您似乎必須獲取要注入CSS的所有頁面的TabID，然後遍歷它們以便爲每個TabID注入CSS？

這是需要的還是我完全不在這裏？它似乎應該比我所建議的更直接。謝謝！

來源

2012-12-24 Ken

不要害怕我的朋友，這是對您的問題的適當解決方案。

manifest.json 我們將指定我們想要注入CSS的URL以及permissions指令中的選項卡。

"permissions":[ 
    "tabs", 
    "https://google.com.mx/*" 
],

background.js 添加了適當的onClick監聽器。

chrome.browserAction.onClicked.addListener(browserListener);

與聽者看起來像這樣

var browserListener = function(tab) { 
    var regexPage = new RegExp(/https:\/\/www.google.com.mx\//); // We use a regular expresion to check which page was given. 
    var match = regexPage.exec(tab.url); // We then check if the given page matches our expression. 
    // If it matches and the status of the tab is complete... 
    if(match && tab.status === 'complete') { 
     //We insert the css 
     chrome.tabs.insertCSS(tab.id, { 
      file: "css/test.css" 
     }); 
    } 
}

如果在權限指令要求的權限給所有頁面https://*/*可以跳過匹配部分。這使您可以更靈活地處理內容腳本，它們僅通過匹配來觸發;只要記住，就像使用任何CSS一樣，您需要指定適當的規則來覆蓋頁面中的某些規則，以便查看更改，其中大部分時間意味着在您的css中使用important!標記。

來源

2012-12-24 23:16:42 jjperezaguinaga

Chrome擴展 - 注入的CSS在瀏覽器的操作頁面點擊

回答

相關問題