今天早上打开博客园.看到一文章"开发chrome扩展程序"
自己看看,也还很简单,就自己动手写一个翻译插件

来看看效果

以前用谷歌的翻译接口做了一个翻译功能的网页http://liuju150.cacacoo.com

所以我就打算把这个功能做成一个谷歌浏览器的插件
这个翻译功能就一个页而.代码也很简单

+ View Code?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>翻译</title>
<style type="text/css">
#MainTable
{
    width:100%;
    text-align:center;
}
</style>
<script type="text/javascript" src="http://www.google.com/jsapi?v=1&key=ABQIAAAACqGEg_EWjzyatp5DcvOejRR4W90b60fHZvOCS2noQmQiRb84KxQixoel7iEIiOVRigOQjXi2AyU3yQ"></script>
<script language="javascript" type="text/javascript">
    google.load("language", "1");
    function BeginTranslate(isTxtTranslateSourceKeyUp) {
        var _txtTranslateSource = document.getElementById("txtTranslateSource");
        var _txtTranslateReturn = document.getElementById("txtTranslateReturn");
        //为空不翻译
        if (isTxtTranslateSourceKeyUp == true && _txtTranslateSource.value == "") {
            _txtTranslateReturn.value = "";
            return;
        } else if (isTxtTranslateSourceKeyUp == false && _txtTranslateReturn.value == "") {
            _txtTranslateSource.value = "";
            return;
        }
        var OldLanguage = document.getElementById("SelectLanguageOld").value;
        var NewLanguage = document.getElementById("SelectLanguageNew").value;
        if (isTxtTranslateSourceKeyUp == false) {
            var _Temp = OldLanguage;
            OldLanguage = NewLanguage;
            NewLanguage = _Temp;
        }
         
        var _text = "";
        if (isTxtTranslateSourceKeyUp == true) {
            _text = _txtTranslateSource.value;
        } else {
            _text = _txtTranslateReturn.value;
        }
        //检测是哪种语言
        if (OldLanguage == "auto") {
            google.language.detect(_text, function (res) {
                if (!res.error) {
                    OldLanguage = res.language;
                    if (isTxtTranslateSourceKeyUp == true) {
                        document.getElementById("SelectLanguageOld").value = res.language;
                    } else {
                        document.getElementById("SelectLanguageNew").value = res.language;
                    }
                }
            });
        }
        //要翻译成什么语言
        //此语言要明确,如果是自动检测的话,就自动换在中文
        if (NewLanguage == "auto") {
            NewLanguage = "zh-CN";
            if (isTxtTranslateSourceKeyUp == true) {
                document.getElementById("SelectLanguageOld").value = NewLanguage;
            } else {
                document.getElementById("SelectLanguageNew").value = NewLanguage;
            }
        }
        //相同判断
        if (OldLanguage == NewLanguage) {
            if (isTxtTranslateSourceKeyUp == true) {
                _txtTranslateReturn.value = "请选择要翻译为什么语言";
            } else {
                _txtTranslateSource.value = "请选择要翻译为什么语言";
            }
            return;
        }
        //是否支持此种语言的翻译
        if (google.language.isTranslatable(NewLanguage) == false) {
            if (isTxtTranslateSourceKeyUp == true) {
                _txtTranslateReturn.value = "不支持此种语言的翻译";
            } else {
                _txtTranslateSource.value = "不支持此种语言的翻译";
            }
            return;
        }
         
        //开始翻译
        google.language.translate({ "text": _text, "type": google.language.ContentType["TEXT"] }, OldLanguage, NewLanguage, function (result) {
            if (!result.error) {
                var ReturnStr = result.translation;
                if (isTxtTranslateSourceKeyUp == true) {
                    _txtTranslateReturn.value = ReturnStr;
                } else {
                    _txtTranslateSource.value = ReturnStr;
                }
            }
        });
    }
    google.setOnLoadCallback(function () { });
</script>
</head>
<body>
<div>
<table id="MainTable">
    <tbody>
        <tr>
            <td align="right">
                <select id="SelectLanguageOld" onchange="BeginTranslate(false)">
                    <option  value="auto">检测语言</option>
                    <option  value="sq">阿尔巴尼亚语</option>
                    <option  value="ar">阿拉伯语</option>
                    <option  value="az">阿塞拜疆语</option>
                    <option  value="ga">爱尔兰语</option>
                    <option  value="et">爱沙尼亚语</option>
                    <option  value="be">白俄罗斯语</option>
                    <option  value="bg">保加利亚语</option>
                    <option  value="is">冰岛语</option>
                    <option  value="pl">波兰语</option>
                    <option  value="fa">波斯语</option>
                    <option  value="af">布尔文(南非荷兰语)</option>
                    <option  value="da">丹麦语</option>
                    <option  value="de">德语</option>
                    <option  value="ru">俄语</option>
                    <option  value="fr">法语</option>
                    <option  value="tl">菲律宾语</option>
                    <option  value="fi">芬兰语</option>
                    <option  value="ka">格鲁吉亚语</option>
                    <option  value="ht">海地克里奥尔语</option>
                    <option  value="ko">韩语</option>
                    <option  value="nl">荷兰语</option>
                    <option  value="gl">加利西亚语</option>
                    <option  value="ca">加泰罗尼亚语</option>
                    <option  value="cs">捷克语</option>
                    <option  value="hr">克罗地亚语</option>
                    <option  value="lv">拉脱维亚语</option>
                    <option  value="lt">立陶宛语</option>
                    <option  value="ro">罗马尼亚语</option>
                    <option  value="mt">马耳他语</option>
                    <option  value="ms">马来语</option>
                    <option  value="mk">马其顿语</option>
                    <option  value="no">挪威语</option>
                    <option  value="pt">葡萄牙语</option>
                    <option  value="ja">日语</option>
                    <option  value="sv">瑞典语</option>
                    <option  value="sr">塞尔维亚语</option>
                    <option  value="sk">斯洛伐克语</option>
                    <option  value="sl">斯洛文尼亚语</option>
                    <option  value="sw">斯瓦希里语</option>
                    <option  value="th">泰语</option>
                    <option  value="tr">土耳其语</option>
                    <option  value="cy">威尔士语</option>
                    <option  value="uk">乌克兰语</option>
                    <option  value="eu">西班牙的巴斯克语</option>
                    <option  value="es">西班牙语</option>
                    <option  value="iw">希伯来语</option>
                    <option  value="el">希腊语</option>
                    <option  value="hu">匈牙利语</option>
                    <option  value="hy">亚美尼亚语</option>
                    <option  value="it">意大利语</option>
                    <option  value="yi">意第绪语</option>
                    <option  value="hi">印地语</option>
                    <option  value="ur">印度乌尔都语</option>
                    <option  value="id">印尼语</option>
                    <option  value="en">英语</option>
                    <option  value="vi">越南语</option>
                    <option  value="zh-CN" selected="selected">中文</option>
                </select>
            </td>
            <td></td>
            <td align="left">
                <select id="SelectLanguageNew" onchange="BeginTranslate(true)">
                    <option  value="auto">检测语言</option>
                    <option  value="sq">阿尔巴尼亚语</option>
                    <option  value="ar">阿拉伯语</option>
                    <option  value="az">阿塞拜疆语</option>
                    <option  value="ga">爱尔兰语</option>
                    <option  value="et">爱沙尼亚语</option>
                    <option  value="be">白俄罗斯语</option>
                    <option  value="bg">保加利亚语</option>
                    <option  value="is">冰岛语</option>
                    <option  value="pl">波兰语</option>
                    <option  value="fa">波斯语</option>
                    <option  value="af">布尔文(南非荷兰语)</option>
                    <option  value="da">丹麦语</option>
                    <option  value="de">德语</option>
                    <option  value="ru">俄语</option>
                    <option  value="fr">法语</option>
                    <option  value="tl">菲律宾语</option>
                    <option  value="fi">芬兰语</option>
                    <option  value="ka">格鲁吉亚语</option>
                    <option  value="ht">海地克里奥尔语</option>
                    <option  value="ko">韩语</option>
                    <option  value="nl">荷兰语</option>
                    <option  value="gl">加利西亚语</option>
                    <option  value="ca">加泰罗尼亚语</option>
                    <option  value="cs">捷克语</option>
                    <option  value="hr">克罗地亚语</option>
                    <option  value="lv">拉脱维亚语</option>
                    <option  value="lt">立陶宛语</option>
                    <option  value="ro">罗马尼亚语</option>
                    <option  value="mt">马耳他语</option>
                    <option  value="ms">马来语</option>
                    <option  value="mk">马其顿语</option>
                    <option  value="no">挪威语</option>
                    <option  value="pt">葡萄牙语</option>
                    <option  value="ja">日语</option>
                    <option  value="sv">瑞典语</option>
                    <option  value="sr">塞尔维亚语</option>
                    <option  value="sk">斯洛伐克语</option>
                    <option  value="sl">斯洛文尼亚语</option>
                    <option  value="sw">斯瓦希里语</option>
                    <option  value="th">泰语</option>
                    <option  value="tr">土耳其语</option>
                    <option  value="cy">威尔士语</option>
                    <option  value="uk">乌克兰语</option>
                    <option  value="eu">西班牙的巴斯克语</option>
                    <option  value="es">西班牙语</option>
                    <option  value="iw">希伯来语</option>
                    <option  value="el">希腊语</option>
                    <option  value="hu">匈牙利语</option>
                    <option  value="hy">亚美尼亚语</option>
                    <option  value="it">意大利语</option>
                    <option  value="yi">意第绪语</option>
                    <option  value="hi">印地语</option>
                    <option  value="ur">印度乌尔都语</option>
                    <option  value="id">印尼语</option>
                    <option  value="en" selected="selected">英语</option>
                    <option  value="vi">越南语</option>
                    <option  value="zh-TW">中文(繁体)</option>
                    <option  value="zh-CN">中文(简体)</option>
                </select>
            </td>
        </tr>
        <tr>
            <td align="right"><textarea id="txtTranslateSource" rows="8" cols="30"></textarea></td>
            <td>
                <button title="从左到右翻译" onclick="BeginTranslate(true)">>></button>
                <br />
                <br />
                <button title="从右到左翻译" onclick="BeginTranslate(false)"><<</button>
            </td>
            <td align="left"><textarea id="txtTranslateReturn" rows="8" cols="30"></textarea></td>
        </tr>
    </tbody>
</table>
</div>
<script language="javascript" type="text/javascript">
    var timer;
    document.getElementById("txtTranslateSource").onkeyup = function () {
        if (timer != null) {
            clearTimeout(timer);
        }
        timer = setTimeout("BeginTranslate(true)", 1000);
    };
    document.getElementById("txtTranslateReturn").onkeyup = function () {
        if (timer != null) {
            clearTimeout(timer);
        }
        timer = setTimeout("BeginTranslate(false)", 1000);
    };
</script>
</body>
</html>

然后看看谷歌的插件文档
在C盘下创建了一个文件夹C:\GoogleDemo


然后把那个网页放到文件夹里面index.html

然后在这个文件夹里面自己创建一个manifest.json文件

文件内容

?
1
2
3
4
5
6
7
8
9
10
11
{
  "name": "Translation(翻译)",
  "version": "1.1",
  "description": "This is a translation plug-in, you can translate between many languages(这是一个翻译插件,可以在很多种语言之间相互翻译)",
  "icons":{"16":"16.png","48":"48.png","128":"128.png"},
  "browser_action": {
        "default_icon": "16.png",
      "popup": "index.html"
  },
  "permissions": ["http://*/","bookmarks","tabs","history"]
}

自己做了几个PNG图标,主要是做插件在浏览器上的图标用,就是浏览器右上角看到我插件的那个图标
然后打开谷歌浏览器输入地址:chrome://extensions/

 开始没有看到我这个插件的,这是我安装上去的效果,
开始的话,选择第一个按钮,就会要你选择你插件所在的文件夹,这里我们选择C:\GoogleDemo
他就会自己载入我们的插件,

然后再选择第二个按钮

第一次可以不选择第二个文件,因为第一次他会自己生成一个GoogleDemo.pem这样的文件

以后你更新了的话.就要选择了,他就知道是在这个插件上的更新,而不是一个新的插件
完成后.就可以在你的谷歌浏览器里看到这个翻译插件了 
DEMO下载

出处：http://www.cnblogs.com/liuju150/archive/2010/09/28/Google_chrome_Extensions_Translation.html

开发谷歌浏览器翻译插件相关推荐

  1. 修改本地host文件加入可用ip使谷歌浏览器翻译插件重新生效

    修改本地host文件加入可用ip使谷歌浏览器翻译插件重新生效 第一步:找到host文件: 可以使用这个工具进行对Hosts文件进行一个查找 鼠标放到对应路径上面 点击鼠标右键,选择打开路径就到对应 路 ...

  2. 谷歌浏览器翻译插件 saladict:沙拉查词

    沙拉查词插件简介 Saladict是一个很好用的网页划词翻译Chrome插件,中文名沙拉查词,功能非常多,支持英汉.英英.俚语.词源.权威例句.汉语等超多词典,并且界面非常清爽,划词翻译速度非常快.支 ...

  3. 谷歌浏览器翻译插件安装步骤

    首先下载最新版谷歌浏览器,这样能保证和我的操作界面一样,因为我的是最新版本的谷歌浏览器 一.先下载可用的翻译插件 插件下载地址:https://download.csdn.net/download/w ...

  4. deepl windows_推荐一个为程序员深度开发的翻译插件DeepL

    DeepL深度翻译器 DeepL一个程序员的翻译神器,可能有人要问,市面上这么多的翻译插件这么多,我为毛要用你的. 首先这个翻译神器可以实现多个翻译引擎的翻译,目前支持有道和google,下一步我会把 ...

  5. 谷歌浏览器翻译插件使用不了，替代品 AnyTranslation

    谷歌(Google)以使用率低为由,停止了Google翻译在中国大陆的服务,导致大陆地区chrome浏览器翻译插件使用不了 但是 无所谓,我会出手 试试 AnyTranslation 替代谷歌自带的网 ...

  6. 谷歌浏览器翻译插件 Linkclump:一次性打开多个链接

    Linkclump的开发背景 网页中的链接是真个网页和浏览器的灵魂,这些链接像血液一样流动于全世界的网站之间,用户可以通过网页链接导航到当前网站中的其他相似页面,或者通过网页链接跳转到别的网站,比如搜 ...

  7. 推荐一些实用的谷歌浏览器翻译插件

    很适合长时间盯着屏幕看的小伙伴们有护眼跟夜间两种模式 看到头条喜欢的视频不知道怎么下载?放心这款插件让你妥妥的下载下来. 点击下载即可下载到本地https://chrome.google.com/we ...

  8. 高准确率的Edage浏览器翻译插件

    使用Windows10的小伙伴都知道,Windows10自带了一款浏览器.这款浏览器主要的优点就是简洁轻便,不像其它的浏览器那么臃肿,对于普通的浏览网页来说,是非常不错的选择. 安利一款简洁轻便,高准 ...

  9. 体验了基于ChatGPT的谷歌翻译插件后，我把其他翻译插件移除了

    最近,一个基于 ChatGPT 的谷歌浏览器翻译插件挺火的,我体验了下,总结下来就一个字"666". github 上已经有 14.9k 的 star 了 传送门:GitHub - ...

  10. android 翻译功能开发,手把手教你开发Android studio翻译插件

    前言 由于我英语很烂,写代码的时候需要用英文命名,有些单词不知道,就只能切换到浏览器打开网页搜索,再拿到英文单词.这样每次都要切换出去,很麻烦,于是,就想着开发一个Android studio插件,在 ...

最新文章

  1. HDU 1711 Number Sequence(KMP算法)
  2. RXJAVA之变换操作
  3. 独家 | 用pandas-profiling做出更好的探索性数据分析（附代码）
  4. 5分绩点转4分_作为一名大学生，如何规划4年大学生活？学姐：建议从这5点做起...
  5. linux网络共享文件夹,[Linux] - Windows与Linux网络共享文件夹挂载方法
  6. 《Hadoop权威指南》第三章 Hadoop分布式文件系统
  7. How to remove live visual tree?
  8. java1.8 新特性
  9. 阿里云使用idea通过hdfs api来上传文件时出现could only be written to 0 of the 1 minReplication nodes.错误
  10. Kotlin入门到放弃
  11. 学习自查：目录(更新中...）
  12. 修改 docker容器hosts文件
  13. Excel操作技巧大全
  14. 多旅行商问题（Multiple Traveling Salesman Problem, MTSP）：单仓库多旅行商问题及多仓库多旅行商问题（含动态视频）
  15. 安卓手机如何打开.crx文件_crx文件怎么安装?谷歌浏览器Chrome打开crx文件的方法...
  16. Spreadsheet_Excel_Writer
  17. 《金粉世家》- 女性从失败的婚姻中觉醒
  18. HTML各种命令的代码
  19. atk-paj7620手势传感器驱动
  20. LCD 调屏几种现象及原因

热门文章

  1. 快乐美工：一键解决模糊图片高清精准优化
  2. 采用 MRT-LBM 模拟旋转圆柱绕流2---MATLAB代码--王富海2017--基于 MRT-LBM 的流场与声场仿真计算
  3. Alert Log中“Fatal NI connect error 12170”错误
  4. HDU4565 So Easy! (矩阵)
  5. C/C++获取系统IP地址
  6. 20190826——python对象实例搬家具
  7. 如何用windows7搭建radius服务器
  8. 深度 | 蚂蚁金融科技全面开放战略背后的“硬实力”
  9. rap技术原理_学rap最基本的都要学什么
  10. 最新炫酷恶趣图制作神器小程序源码+支持流量主/功能强大