【正文】 description: 我的第一個(gè)Chrome插件，還不錯(cuò)吧,1 browser_action: {1 default_icon: ,1 popup: 1 }1 }復(fù)制代碼我們的第一個(gè)插件算是制作成功了。現(xiàn)在讓我們來看看大家都做出了什么樣的擴(kuò)展，把你的第一個(gè)擴(kuò)展上傳上來讓大家看看吧！這個(gè)是我的：Chrome擴(kuò)展開發(fā)指南(2)——概述這篇文章翻譯自，我還沒有真正做過插件，翻譯這篇文章算是班門弄斧，有翻譯的不好的地方請(qǐng)一定指出來，希望能夠達(dá)到完美！( 對(duì)新手說的話：文章涉及到的一些術(shù)語，對(duì)沒有任何網(wǎng)頁知識(shí)的新手來說還是挺難懂的，可以借助Google/baidu看一下，其實(shí)不懂也沒多大關(guān)系，這篇文章只是一個(gè)概述，完全可以跳過這些術(shù)語，希望大家對(duì)制作插件不要失去信心。Chrome擴(kuò)展能做什么呢？我們肯定使用過一些擴(kuò)展，會(huì)發(fā)現(xiàn)有些擴(kuò)展在Chrome地址欄右側(cè)區(qū)域增加一個(gè)圖標(biāo)。s Guide看到。 JavaScript文件 (可選，非必須)也許你注意到當(dāng)使用Google Chrome debugger查看這些文件的時(shí)候給，每個(gè)文件的地址是下面這種格式2 chromeextension://extensionID/pathToFile復(fù)制代碼這個(gè)地址中，extensionID是你制作的擴(kuò)展的唯一標(biāo)示符，也就是擴(kuò)展的身份證編號(hào)。3 {4 name: My Extension,5 version: ,6 description: Gets information from Google.,7 icons: { 128: },8 background_page: ,9 permissions: [://*., ://*.],10 browser_action: {11 default_title: ,12 default_icon: ,13 popup: 14 }15 }復(fù)制代碼擴(kuò)展結(jié)構(gòu)組成結(jié)構(gòu)絕大部分?jǐn)U展有background文件，一個(gè)不可見的文件控制著整個(gè)擴(kuò)展的運(yùn)行。() or ()這種函數(shù)來顯示HTML文件。內(nèi)容腳本(Content scripts)如果你插件需要和網(wǎng)頁交互，那么他就需要一個(gè)內(nèi)容腳本(Content scripts)，內(nèi)容腳本常由JavaScript編寫，會(huì)在網(wǎng)頁載入完成后調(diào)用。注意。由于擴(kuò)展的所有文件都由同一個(gè)進(jìn)程執(zhí)行，網(wǎng)頁能夠直接給其他頁面發(fā)送命令。本文由ChromeChina翻譯，轉(zhuǎn)載注明出處Chrome擴(kuò)展開發(fā)指南(3)——Browser Action(擴(kuò)展圖標(biāo))這是擴(kuò)展開發(fā)指南的第三篇，前面我們首先作了第一個(gè)擴(kuò)展，然后學(xué)習(xí)了Chrome擴(kuò)展的大概結(jié)構(gòu)，看完后可能會(huì)有些迷惑，別擔(dān)心，相信隨著我們學(xué)習(xí)的深入，我們漸漸發(fā)現(xiàn)我們已經(jīng)可以做擴(kuò)展了。(同樣，有翻譯需要改進(jìn)的地方請(qǐng)指出來)Browser Actions的作用就是控制Chrome地址欄右側(cè)添加一個(gè)圖標(biāo)。Browser Action在Manifest文件中的位置下面是個(gè)在擴(kuò)展的manifest文件中注冊(cè)browser action的例子：1 {2 name: My extension,3 ...4 browser_action: {5 default_icon: images/, // required6 default_title: Google Mail, // optional。你可以用兩種方法定義圖標(biāo)：用一個(gè)靜態(tài)圖片，或者用HTML中的canvas元素。提示文字提示文字是指將鼠標(biāo)移到擴(kuò)展圖標(biāo)上顯示的文字。設(shè)置標(biāo)記文字或者背景可以分別使用 setBadgeText() and setBadgeBackgroundColor()。幾個(gè)小提醒為了擴(kuò)展更加美觀，請(qǐng)遵守下列守則：僅在這個(gè)擴(kuò)展需要在大部分頁面運(yùn)行的時(shí)候才使用browser action僅在小部分頁面起作用的話就不要用browser action，而是用page actions。其中有個(gè)set_page_color，我們?cè)囍匦戮帉懰?3 margin: 0px。30 }3132 div {33 cursor: pointer。37 fontsize: 。41 }42 div:hover {43 background: aaaaaa。51 color: blue。59 color: yellow。66 ()。我們還需要一個(gè)圖標(biāo)顯示在工具欄上，把這個(gè)圖片保存到文件夾中。})。).getElementsByTagName(39。})。如果設(shè)置了選項(xiàng)頁面，那么擴(kuò)展管理頁chrome://extensions將會(huì)有一個(gè)鏈接指向選項(xiàng)頁面。15 localStorage[favorite_color] = color。22 }, 750)。32 for (var i = 0。36 break。一個(gè)重置頁面常常是用HTML、JavaScript、CSS組成。1 {2 name: My extension,3 ...4 chrome_url_overrides: {5 newtab: 6 },7 ...8 }復(fù)制代碼幾點(diǎn)注意事項(xiàng)為了讓你定義的新標(biāo)簽頁看起來不錯(cuò)，請(qǐng)遵循下面幾點(diǎn)建議： 確保有title標(biāo)簽如果沒有title，大家講會(huì)看到頁面的URL，這會(huì)讓人很迷惑，我們應(yīng)該包含這樣一句 titleNew Tab39。 不要模仿默認(rèn)的新標(biāo)簽頁面創(chuàng)建默認(rèn)標(biāo)簽頁的API（比如最近關(guān)閉的標(biāo)簽、最常訪問的網(wǎng)站等等）不存在！你必須做出一些完全不同的東西。比如以下功能只在特定頁面才有：RSS訂閱圖標(biāo)(僅在有rss訂閱功能的網(wǎng)頁中才顯示)幻燈片顯示照片（僅在特定的照片分享網(wǎng)頁中有這種功能）下面是個(gè)顯示RSS訂閱圖標(biāo)的圖：如果你希望能夠一直顯示這個(gè)圖標(biāo)，可以使用擴(kuò)展圖標(biāo)。但是他們不能帶有徽標(biāo)，但是地址欄圖標(biāo)能夠顯示/隱藏。當(dāng)你要顯示這個(gè)圖標(biāo)的時(shí)候，你必須指定哪一個(gè)t