這節(jié)課實(shí)現(xiàn)的效果如下圖所示:

我們先想一想，怎么樣才可以在搜索框上輸入內(nèi)容呢，當(dāng)然可以手動(dòng)輸入^_^，除了這個(gè)之外呢? 如果您有這個(gè)頁面的后臺(tái)編輯權(quán)限就可以直接修改這個(gè)頁面的內(nèi)容。當(dāng)然，這個(gè)頁面是google的， 我們沒有這個(gè)權(quán)限。雖然我們沒有后臺(tái)的權(quán)限，但我們可以獲取到前臺(tái)的權(quán)限，比如我們可以把這個(gè)文檔 保存到本地，然后編輯。不過這不是我們想要的，我們有更好的方法。這個(gè)方法是什么呢?就是注入javascript， 意思就是讓某個(gè)頁面執(zhí)行我們定義的一段javascript代碼。那么這個(gè)頁面你就可以隨心所欲地修改了。 那么下面我們就說說注入的方法，javascript的注入是由manifest.json文件定義的，只要在上節(jié)課的 manifest.json文件中添加一個(gè)"content_scripts"字段即可，詳細(xì)說明及代碼如下: 以下內(nèi)容為程序代碼:

1 {
2 ????"name":"Hello Chrome",
3 ????"version":"1.0.0",
4 ????"icons":{
5 ????????"48":"icon.png"
6 ????},
7 ????"browser_action":{
8 ????????"default_title":"Hello browser action",
9 ????????"default_icon":"action.png",
10 ????????"popup":"popup.html"
11 ????},
12 ????"content_scripts":[{
13 ????????"matches":["http://www.google.com.hk/*"],
14 ????????"js":["inject.js"],
15 ????????"run_at":"document_end"
16 ????}]
17 } "matches"字段表示要注入到哪些頁面，我們這個(gè)擴(kuò)展是作用于http://www.google.com.hk, 所以這個(gè)字段的值就如上代碼所示，我們還注意到上面所示的值有一個(gè)星號(hào)"*"，這個(gè)符號(hào)的作用 是匹配任意以"http://www.google.com.hk/"開頭的URL。所以我們注入的代碼不緊是對(duì) "http://www.google.com.hk" 而且也對(duì)"http://www.google.com.hk/imghp?hl=zh-CN&tab=wi&q=%E5%9C%A8google%E6%90%9C%E7%B4%A2%E6%A1%86%E4%B8%AD%E8%BE%93%E5%85%A5%E5%86%85%E5%AE%B9" 有效。 "js"字段顯而易見的，表明注入的是哪個(gè)js文件。 "run_at"字段所表示的是javascript注入的時(shí)機(jī)，這里的時(shí)機(jī)是"document_end"，表示在文檔裝載完畢時(shí)進(jìn)行注入。 好的，我們編輯完了manifest.json文件，現(xiàn)在讓我們添加一個(gè)名為inject.js的文件，代碼如下所示: 以下內(nèi)容為程序代碼:

1 var e=document.getElementById("lst-ib");
2 e.value="在google搜索框中輸入內(nèi)容";
這節(jié)課完成的工程下載:http://files.cnblogs.com/JiangHuakey/1.2browser_action.zip
在筆者的chrome論壇上也可以找到該文章:http://www.chinachrome.net/dispbbs.asp?boardid=2&id=13&page=1&star=1

轉(zhuǎn)載于:https://www.cnblogs.com/JiangHuakey/archive/2011/09/08/2171053.html

總結(jié)

以上是生活随笔為你收集整理的chrome扩展之3：一步步跟我学开发一个表单填写扩展的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。