Chrome扩展程序太慢了

时间:2012-11-30 16:12:08

标签: javascript google-chrome-extension

我在Firefox和Chrome上使用了一个小script即时消息, 它只是改变了这个页面的颜色。 在Firefox中它只是工作正常, 但是在Chrome中我可以看到页面的原始颜色,然后在它发生变化后几秒钟。

这是正常的吗? (怎么样)我能改变吗?

1 个答案:

答案 0 :(得分:3)

我不知道如何使用GM脚本,但是这里是如何将其作为Chrome扩展程序....

manifest.json

{
    "name": "SO css",
    "content_scripts": [
        {
         "matches": [
            "http://*.stackoverflow.com/*"
         ],
         "css": ["new.css"],
         "run_at" : "document_start"
        }
    ],
    "version":"1.0",
    "manifest_version" : 2
}

new.css

#custom-header       {background-color: rgb(251,122,35) !important}

#nav-questions       {background-color: rgb(251,122,35) !important}
#nav-tags            {background-color: rgb(251,122,35) !important}
#nav-users           {background-color: rgb(251,122,35) !important}
#nav-badges          {background-color: rgb(251,122,35) !important}
#nav-unanswered      {background-color: rgb(251,122,35) !important}
#nav-askquestion     {background-color: rgb(251,122,35) !important}

内容脚本信息.... http://developer.chrome.com/extensions/content_scripts.html
有关Chrome扩展程序的信息.... http://developer.chrome.com/extensions/getstarted.html

如果GM脚本的等效值为run_at,那么它需要document_start,因为它的声音就像css正在document_idle注入,这将在加载dom / page之后。你之前想要它,所以你不会看到它改变。这就是我为什么在我的答案中为每个css规则添加!important的原因,以确保它们不会被任何可能跟随你的css改变。

修改
看了一下,有一个run_at变量,这里和上面一样,但作为GM脚本....

// ==UserScript==
// @name        SO
// @namespace   stackoverflow.com
// @include     *stackoverflow.com/*
// @version     1
// @grant       GM_addStyle
// @run-at      document-start
// ==/UserScript==

changeHeaderColor ();

function changeHeaderColor () {
    GM_addStyle ( "                                                 \
        /*body { color: white; background-color: black !important}            \
        */                                                          \
        #custom-header       {background-color: rgb(251,122,35) !important}    \
                                                                    \
        #nav-questions       {background-color: rgb(251,122,35) !important}    \
        #nav-tags            {background-color: rgb(251,122,35) !important}    \
        #nav-users           {background-color: rgb(251,122,35) !important}    \
        #nav-badges          {background-color: rgb(251,122,35) !important}    \
        #nav-unanswered      {background-color: rgb(251,122,35) !important}    \
        #nav-askquestion     {background-color: rgb(251,122,35) !important}    \
        /*Blau: rgb(0,160,160) rgb(0,200,200)                       \
        */                                                          \
    " );
}