新手如何開發(fā)Chrome擴展，任務是自動填充一個文本框

如果您想開發(fā)一個 Chrome 瀏覽器擴展來自動填充文本框，可以按照以下步驟進行：

1. 準備開發(fā)環(huán)境：您需要安裝 Chrome 瀏覽器和一個文本編輯器，例如 Sublime Text、Atom 等。
2. 創(chuàng)建擴展項目文件夾：創(chuàng)建一個名為 “my_extension” 的文件夾，并在其中創(chuàng)建一個名為 “manifest.json” 的文件。
3. 編寫 manifest.json：在 “manifest.json” 文件中，您需要定義擴展的基本信息，例如名稱、版本、描述等。您還需要定義要使用的腳本文件和標識需要操作的文本框。
4. 編寫腳本文件：創(chuàng)建一個名為 “fill_textbox.js” 的文件，并在其中編寫自動填充文本框的代碼。
5. 加載擴展：打開 Chrome 瀏覽器，轉(zhuǎn)到 “chrome://extensions/” 頁面，并啟用 “開發(fā)者模式”。點擊 “加載已解壓的擴展程序” 按鈕，并選擇 “my_extension” 文件夾。
6. 測試擴展：在 Chrome 瀏覽器中打開包含文本框的網(wǎng)頁，并檢查文本框是否被正確填充。

以下是一個樣例 manifest.json 文件：

{
“manifest_version”: 2,
“name”: “My Extension”,
“version”: “1.0.0”,
“description”: “A simple extension that fills a text box.”,
“permissions”: [
“activeTab”
],
“background”: {
“scripts”: [“background.js”],
“persistent”: false
},
“content_scripts”: [
{
“matches”: [“<all_urls>”],
“js”: [“fill_textbox.js”]
}
],
“browser_action”: {
“default_icon”: “icon.png”,
“default_title”: “Fill Text Box”
}
}

• manifest_version：清單版本，必須為 2(目前最新文檔應該是3，其它語法結構也做了變化)。
• name：擴展名稱。
• version：擴展版本。
• description：擴展描述。
• permissions：擴展所需的權限。在此示例中，它需要訪問當前選項卡。
• background：定義后臺腳本的選項。
• content_scripts：定義注入頁面的腳本。在此示例中，它將匹配所有 URL 并注入 fill_textbox.js 腳本。
• browser_action：定義瀏覽器操作選項，例如默認圖標和標題。

請注意，此樣例僅提供了基本的清單文件結構，您可以根據(jù)需要添加其他選項和配置。請參閱 Chrome 擴展文檔以了解更多信息。

自動讀取硬盤上的a.txt，a.txt文件是用回車符換行的，每隔5分鐘讀取文件里面的一行文本，把讀取到的內(nèi)容輸入到頁面文本框，文本框的 class開頭字母是”m-0 w-full”，然后自動按回車:

// background.js

// 讀取 a.txt 文件的函數(shù)
function readTextFile(file) {
var rawFile = new XMLHttpRequest();
rawFile.open(“GET”, file, false);
rawFile.onreadystatechange = function () {
if (rawFile.readyState === 4) {
if (rawFile.status === 200 || rawFile.status == 0) {
var allText = rawFile.responseText;
// 將文件內(nèi)容以換行符分割為數(shù)組
var lines = allText.split(“\n”);
return lines;
}
}
};
rawFile.send(null);
}

// 每隔 5 分鐘讀取一行文本并輸入到頁面文本框
setInterval(function () {
var lines = readTextFile(“a.txt”);
for (var i = 0; i < lines.length; i++) {
// 只有當文本框存在時才執(zhí)行
if ($(“.m-0.w-full”).length) {
$(“.m-0.w-full”).val(lines[i]);
$(“.m-0.w-full”).trigger($.Event(“keydown”, { keyCode: 13 }));
}
}
}, 5 * 60 * 1000);