--1. 在html文件中引用js 文件
--2.在Google Chrome中開發簡單插件
1.首先，簡單說明一下在html 中引用js 文件：
將kittenbook.html 和 kittenbook.js 文件放在相同的目錄下，兩個文件的內容如下：
<html> <body> <p> Hello,world</p> <script type="text/javascript" src="kittenbook.js"></script> </body> </html>
var username = prompt('Hello, what \'s your name?'); document.body.innerHTML = '<h1>Hello, ' + username + '!</h1>';
輸入name（此處輸入Sam），並點擊確定；根據 kittenbook.js的配置，會出現如下所示：
2.在Google Chrome 瀏覽器中開發插件 --- 此例為，訪問百度主頁時，會出現問候語。
首先打開 開發者模式 
新建一個manifest.json 文件，此處內容為：
{ "manifest_version": 2, "name" : "kittenbook", "description" : "Replace photos on Facebook with kittens", "version": "0.0.1.1", "content_scripts" :[ { "matches" : ["*://www.baidu.com/*"], "js" : ["value.js" , "prompt.js"] } ] }
value.js 和 prompt.js 的內容如下，這三個文件是放在同一個目錄下的。
prompt.js
var username = prompt('Hello, what \'s your name?'); //Option 1 ,use username/projectName/versionNumber/currentTime directly document.body.innerHTML = '<h1>Hello, ' + username + '!</h1>' + '<p>' + projectName + ' ' + versionNumber + ' accessed on:' + currentTime + '<p>'; //Option w ,use object to store username/projectName/versionNumber/currentTime value //document.body.innerHTML = '<h1>Hello, ' + username + '!</h1>' + // '<p>' + kbValues.projectName + ' ' + kbValues.versionNumber + ' accessed on:' + kbValues.currentTime + '<p>';
value.js
var projectName = 'kittenbook'; var versionNumber = '1.0.2'; var currentDate = new Date(); var currentTime = currentDate.getFullYear() + '-' + (currentDate.getMonth() + 1) + '-' + currentDate.getDate() + ' at ' + currentDate.getHours() + ":" + currentDate.getMinutes() + ":" + currentDate.getSeconds(); var kbValues = { projectName: projectName, versionNumber : versionNumber, currentTime : currentTime };
manifest.json / prompt.js /value.js，准備好之后，使用Chrome瀏覽器，在擴展程序頁面，點擊 “加載已解壓的擴展程序” 加載 manifest.json 文件：
加載成功后，如下所示:
此時，在Chrome瀏覽器中輸入 www.baidu.com ,會彈出提示框：
輸入name,並點擊確定，會看到如下頁面:
啟用這個插件后，會影響正常訪問百度主頁。開發完成后，在瀏覽器擴展程序頁面取消啟用插件即可。
---可參考《一路編程》 Steven Foote