社区首页 >问答首页 >铬扩展替换选定的文本

铬扩展替换选定的文本
EN

Stack Overflow用户
提问于 2013-11-03 14:25:56
回答 1查看 930关注 0票数 2

我正在尝试将我的firefox插件移植到chrome上,下面是我的示例代码。

档案: myscript.js (部分)

代码语言:javascript
代码运行次数:0
复制
.
.
function init() {
  .
  .
  .
}
function myFunc(inp, option) {
  .
  .
  .
}

chrome.extension.onMessage.addListener(function (message, sender, response) {
    switch (message) {
        case "ITRANS":
            console.log("ITRANS");
            if (document.getSelection().baseNode != null){ 
                init();
                window.modifySelection(myFunc(window.getSelection().toString(), 0)); 
            }
            break;
        case "Devanagari":
            console.log("Devanagari");
            if (document.getSelection().baseNode != null){ 
                init();
                window.modifySelection(myFunc(window.getSelection().toString(), 1)); 
            }
            break;
        default:
            console.log("Default");
    }
});

文件: background.js

代码语言:javascript
代码运行次数:0
复制
var _selection_univ = chrome.contextMenus.create({
    "title": "INDIC 2 ITRANS",
    "id": "ITRANS",
    "onclick": reportclick,
    "contexts": ["selection"]
}, function () {
    console.log("Context Menu 1 ITRANS");
});
var _selection_univ = chrome.contextMenus.create({
    "title": "Eng 2 Devanagari",
    "id": "Devanagari",
    "onclick": reportclick,
    "contexts": ["selection"]
}, function () {
    console.log("Context Menu 2 Devanagari");
});

function reportclick(info, tab) {
    switch (info.menuItemId) {
        case "ITRANS":
        console.log("BG: ITRANS");
            chrome.tabs.sendMessage(tab.id, "ITRANS");
            break;
        case "Devanagari":
        console.log("BG: Devanagari");
            chrome.tabs.sendMessage(tab.id, "Devanagari");
            break;
        default:
            console.log("BG: Default");
    }
}

文件: manifest.json

代码语言:javascript
代码运行次数:0
复制
{
  "name": "Parivartan",
  "version": "0.8.2",
  "manifest_version": 2,
  "permissions":[
    "contextMenus",
    "<all_urls>",
    "tabs"
  ],
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["myscript.js"],
      "all_frames": true
    }
  ],
  "background": {
    "scripts": ["background.js"]
   }
}

我想不出有几件事。

(1)应该在哪里放置init()函数(应该只运行一次以初始化插件全局)。

(2)将选定的文本替换为函数的输出。上面的代码不起作用,上面写着"modifySelection“找不到。

(3)如果函数位于不同的(file2.js)文件中,如何调用它们。目前,我将所有函数放在一个文件(myscript.js)中。

(4)如何在菜单中创建菜单。

我试着在google上搜索,但是找不到解决上述问题的方法。有人能帮帮我吗。

-Mohan

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-11-04 01:34:36

(1)我的init()函数应该放在哪里(应该只运行一次来初始化插件全局) ?

根据您的需求,有两个事件应该满足您的初始化需求:

chrome.runtime.onInstalled

当扩展第一次安装、扩展更新到新版本和Chrome更新到新版本时触发。

例如:chrome.runtime.onInstalled.addListener(function() {...});

chrome.runtime.onStartup

当安装了此扩展的配置文件首先启动时触发。启动匿名配置文件时不会触发此事件,即使该扩展在“拆分”隐名模式下运行。

例如:chrome.runtime.onStartup.addListener(function(details) {...});

(2)用函数的输出替换选定的文本。上面的代码不起作用,上面写着"modifySelection“没有找到.

这是因为没有定义函数modifySelection。你从哪里得到这个名字的?更新

根据OP在注释中的反馈,一个简单的modifySelection()函数可能如下所示:

代码语言:javascript
代码运行次数:0
复制
function modifySelection(newValue) {
    var range = document.getSelection().getRangeAt(0);
    range.deleteContents();
    range.insertNode(document.createTextNode(newValue));
}

(注:只有在选择只涉及TextNodes时才能正常工作。在其他情况下,它可能破坏DOM,因此需要对所选内容进行更详细的解析。)

如果函数位于不同的(file2.js)文件中,(3)如何调用它们。目前,我将所有函数放在一个文件(myscript.js)中。

注入所有必要的文件,然后像往常一样调用函数。也就是说,所有注入的内容脚本都在同一个JS上下文中执行。例如:

代码语言:javascript
代码运行次数:0
复制
"content_scripts": [{
  "matches": ["<all_urls>"],
  "js": ["file1.js", "file2.js", ...],
  "all_frames": true
}],

file1.js中:

代码语言:javascript
代码运行次数:0
复制
...
function funcInFile1() {...}
...

file2.js

代码语言:javascript
代码运行次数:0
复制
...
var res = funcInFile1();
...

(Note:内容脚本按它们出现在"js“数组中的顺序注入。在调用每个资源之前,确保它是可用的。例如,在注入funcInFile1()之前尝试调用file1.js将导致错误。)

(4)如何在菜单中创建菜单.

如果您的意思是“创建子菜单”,则可以在createProperties函数的parentId参数中包含一个parentId属性:

parentId: 父菜单项的ID;这使该项成为以前添加的项的子项。

还可以看到这个演示扩展,它(以及其他事情)就是这样做的。

一些结束语--

  1. chrome.extension.onMessage被否决了。请使用chrome.runtime.onMessage代替。
  2. 如果可能的话,尝试使用事件页 (而不是背景页面)。
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19758956

复制
相关文章
文本替换demo
package com.na.ip; import java.io.BufferedReader; import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStreamReader; import java.io.OutputStreamWriter; import java.net.InetAd
JQ实验室
2022/02/14
1.1K0
Python中的文本替换
对于习惯了Java中的replace,Python的replace用起来有些不适应,因为后者不支持直接使用正则表达式。要实现通过正则表达式的替换,可以配合Python的正则表达式模块使用。比如:
py3study
2020/01/10
4.6K0
python替换文本范围
同事问怎么批量把某文本中有"/*" 开头"*/"结尾的内容删除. 比较方便的办法是用awk,sed什么的.
py3study
2020/01/10
1.1K0
Shell 中的命令替换及参数扩展
今天和大家分享的主要是 “命令替换” 以及 “参数扩展” 。 -- 季文康 本文导航 ◈ 前言 00% ◈ 什么是命令替换 14% ◈ 1、一层 SHELL 嵌套 15% ◈ 2、二层 SHELL 嵌套 17% ◈ 3、进阶 30% ◈ 什么是参数扩展 44% ◈ 1、实例一 46% ◈ 2、实例二 52% ◈ 什么是变量扩展 57% ◈ 1、变量替换 65% ◈ 2、变量切片 74% ◈ 3、变量修改 80% ◈ 更深入学习,探索资料 95% 转载自 | http://www.cnblogs.com/
企鹅号小编
2018/01/30
1.5K0
Shell 中的命令替换及参数扩展
linux 使用sed替换文本
背景:在linux 服务器上,有时我们想通过命令行的方式替换掉文件中的某个字符串,可以使用sed命令。具体的命令详情可参考:http://www.runoob.com/linux/linux-comm-sed.html
小白will
2019/01/28
5.9K0
文本替换原来可以这么玩~
今天是第三期朋友提问解答分享~ 今天提问的是我的一位好兄弟,和我同年入职某公司,后来离职独自执剑闯天涯。如今已经事业有成,每天为了心中的理想奋斗,而我还在苦逼的每天晚上码字写Excel知识分享。 也许
用户1332619
2018/03/08
8800
文本替换原来可以这么玩~
一款简单的文本替换工具
本人经常阅读一些技术文章,觉得写的比较好且于我比较实用的文章,我都会转载于此博客网站。此时就会用到一些html转md工具,但是略有瑕疵。比如代码块的转换,正常是``` 代码 ```,转换的也正常,但是我的md可以指定代码的语言,比如```bash 代码 ```。为了完美,我每次都是手动替换,这对于程序员来说,是我给程序员丢脸了。所以用js写了一个简单的文本替换工具。
cultureSun
2023/07/08
2680
一款简单的文本替换工具
matplotlib:如何选定颜色
此颜色选择方式是由正则匹配的 C[0-9] 来确定颜色。只要是支持这种颜色的地方都可以通过这种方式来设置,而且也可以作为 matplotlib.Axes.plot 的单字符颜色。
bugsuse
2020/04/21
1.1K0
matplotlib:如何选定颜色
WordPress 技巧:如何快速替换日志中的文本
WordPress 技巧:如何快速替换日志中的文本,把下面的代码放到当前主题的 functions.php 文件中,然后在第四行需要替换的文本改成你的:
Denis
2023/04/15
1.8K0
使用脚本批量替换文本内容
很多时候,我们需要进行多个文件的查找并替换,虽然IDE有这样的可视化功能,但是偏爱终端的人还是想要尝试用脚本实现一把。如下是一个简单的脚本来实现多文件的查找替换处理。
技术小黑屋
2020/01/19
2.7K0
直播短视频源码,实现文本替换
直播短视频源码,实现文本替换相关的代码 Person-Using-Black-Dslr-Camera_Fzq5PD3oIpu3.jpeg #include <stdio.h> #include <
yunbaokeji柯基
2021/01/03
7320
直播短视频源码,实现文本替换
php案例:文本内容查找替换功能
作者:陈业贵 华为云享专家 51cto(专家博主 明日之星 TOP红人) 阿里云专家博主 文章目录 cyg.php 点击提交的内容是: 原先的1.txt文件里面的内容: 替换后的: ---- cyg.php <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> 文本内容查找替换 </title>
贵哥的编程之路
2022/09/23
2.1K0
php案例:文本内容查找替换功能
铬镍不锈钢的切削加工
  1Cr18Ni9Ti不锈钢的强度硬度很低(硬度≤187HB),而塑性很高,具有良好的耐酸性、耐腐蚀性。经固溶处理后的机械性能,屈服强度s0.2≥205MPa,抗拉强度sb≥520MPa,伸长率d5≥40%,收缩率y≥50%,用常规牌号的硬质合金刀具和常规方法加工很困难,原因是该材料的塑性及韧性较大,容易产生粘刀现象,断屑困难,同时产生振动,使刀具容易崩刃、磨损。
lrglu
2022/03/30
6640
铬镍不锈钢的切削加工
idea替换文本快捷键_idea 替换整个项目某个单词
1、“ctrl+r”快捷键,用于当前文件内容替换,指的是在当前打开的文件中替换匹配的字符,只操作一个文件;
全栈程序员站长
2022/09/28
2.9K0
编码技巧 --- 同步锁对象的选定
线程锁的原理,就是锁住一个资源,使得应用程序在此刻只有一个线程访问该资源。通俗地讲,就是让多线程变成单线程。在C#中,可以将被锁定的资源理解成 new 出来的普通CLR对象。
Niuery Diary
2023/10/22
1350
编码技巧 --- 同步锁对象的选定
三款文本批量查找替换工具
码农必备,全部免费,神器不解释! 超级替换V5.02(UltraReplace) 喜欢:功能繁多,多内容替换是亮点,拖拽功能十分方便,对各种编码支持较好。 吐槽:查找功能好弱啊~ 文本批量搜索替换V6.5(Search\_and\_Replace) 喜欢:功能强大,支持ZIP文件 吐槽:新版旧版变化不大,不支持UTF8 字符查找(FindStr) 喜欢:界面简洁,可以与资源管理器关联,也支持ZIP文件,最重要的是支持UTF8!! 吐槽:不能拖拽,功能简单。 丢个链接走人~ 解压密码: www.phpgao.
老高的技术博客
2022/12/27
2.6K0
编码技巧 --- 同步锁对象的选定
线程锁的原理,就是锁住一个资源,使得应用程序在此刻只有一个线程访问该资源。通俗地讲,就是让多线程变成单线程。在C#中,可以将被锁定的资源理解成 new 出来的普通CLR对象。
郑子铭
2023/08/30
1290
编码技巧 --- 同步锁对象的选定
文本文件关键字替换(Java)
代码实现如下: import java.io.File; import java.io.PrintWriter; import java.util.Scanner; public class FileReplaceKeywords { public static void main(String[] args) throws Exception { // 检测参数 if (args.length != 4) { System.out
云海谷天
2022/08/09
5750
文本文件关键字替换(Java)
如何在 Python 中搜索和替换文件中的文本?
让我们看看如何在文本文件中搜索和替换文本。首先,我们创建一个文本文件,我们要在其中搜索和替换文本。将此文件设为 Haiyong.txt,内容如下:
海拥
2021/10/20
16K0
前端页面替换文本的方法和一些小技巧
在前端页面替换文本有几种做法,不假思索的答案通常是直接用JavaScript。但你有没有想过这完全可以用CSS实现呢? 背景 在前端页面上,有的时候我们需要根据用户行为,替换的显示文本。比如 “显示/隐藏”、“展开/收起”。这是一个很常见的功能,实现起来也没有太大的难度。 CSS Tricks 有一篇文章谈及“替换文本的五种方法”(Swapping Out Text, Five Different Ways)。在这篇文章里,作者总结了使用五种实现方法,并且在评论里和很多读者进行了一些讨论分析。我在这里总
ThoughtWorks
2018/04/18
2.3K0

相似问题

侦听铬扩展中选定的文本拖动事件。

13

替换文本,但保留谷歌铬扩展内容脚本中的链接

28

文本查找和替换铬扩展-它们是如何工作这么快?

21

Chrome扩展选定文本

11

如何将google文档中的选定文本转换为铬扩展名?

210
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文