javascript - 使用js替换gmail上的文本
问题描述
我正在开发一个 chrome 扩展,它替换了部分文本。但是,它在 Gmail 上无法正常工作。
斯卡纳里奥:
Gmail 作曲家有以下文字 -
我现在就是这个。
我可以做这个。
我想把它换成——
我是新来的。
我可以做这个。
但是,每当我执行代码时,它都不会替换正确位置的文本。它会看到我的光标所在的位置并将文本附加到那里而不是替换预期的文本。此代码段适用于具有内容可编辑编辑器的其他网站。
我当前的实现如下所示:
const range = document.createRange();
const ele = <div tag element for 'i am now to this.' sentence>
// rangeStart and rangeEnd are the index which wraps word 'now'
range.setStart(ele.childNodes[0], rangeStart);
range.setEnd(ele.childNodes[0], rangeEnd);
const selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
setTimeout(()=>{
document.execCommand(
"insertText",
false,
"new"
);
},0)
解决方案
有几件事可能会出错。
一个是我注意到div
最初包含一个 textNode 和一些文本切换到一个包含多个 textNodes 的节点,并且所有文本都完全相同,并且考虑到您只使用children[0]
.
对我不起作用的另一件事是执行isertText
对我有用的东西如何:
var range = document.createRange();
var rangeStart = el.innerText.indexOf(s);
var rangeEnd = rangeStart + s.length;
var selection = window.getSelection();
range.setStart(el.childNodes[0], rangeStart);
range.setEnd(el.childNodes[0], rangeEnd);
selection.removeAllRanges();
selection.addRange(range);
range.deleteContents();
range.insertNode(document.createTextNode(ss))
我的整个测试场景:
(()=>{
var all = document.getElementsByTagName('div');
var n = all.length;
var find = (s)=>{
var result = [];
for (var i = 0; i < n; i++) {
var el = all[i];
var text = el && el.childNodes && el.childNodes[0] && el.childNodes[0].wholeText;
if (text && text.match(s)) {
result.push(el);
}
}
return result.length ? result : false;
}
;
var replacer = (s,ss)=>(el)=>{
try {
var range = document.createRange();
var rangeStart = el.innerText.indexOf(s);
var rangeEnd = rangeStart + s.length;
range.setStart(el.childNodes[0], rangeStart);
range.setEnd(el.childNodes[0], rangeEnd);
var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);
range.deleteContents();
range.insertNode(document.createTextNode(ss))
}catch(ex){
}
}
;
var elements = find('now');
if (elements) {
elements.map(replacer('now', 'new'))
}
}
)(window);
祝你好运 :)
推荐阅读
- ios - 无法在获取请求中使用文本解码 json
- javascript - JavaScript 全局变量解决方法
- hyperledger-composer - @returns 在 docker 本地运行时抛出错误
- swift - iOS 中的 PEM 编码证书转换
- powershell - 在 powershell 中打开一个程序并获取它的句柄
- maven - 通过 Eclipse 创建 Maven Archetype
- javascript - 在哪里可以找到原型链中函数的变量?
- javascript - 观察者不使用 Vuex
- c++ - 将语言环境更改为瑞典语
- ckeditor - 从 TYPO3 中的 ckeditor 将“fontsize”添加到自定义 yaml 文件