我有一个基于 javascript 的 Google Chrome 扩展程序,它将网页中当前选定的文本作为输入,然后将该文本翻译成英文。原始文本在同一位置被翻译文本替换...
我有一些网站将显示在 iframe 中的要求,对于这些网站,我还想翻译 iframe 中当前选定的文本。
扩展开头的源码,获取当前选中的文本,如下--
var selection = document.getSelection();
var range = selection.getRangeAt(0);
如何更改上面的代码/添加一些代码,以便变量“selection”可以存储主窗口中当前选定的文本,或 iframe 中当前选定的文本?即使要翻译的文本位于 iframe 中,也应正确初始化变量“范围”...
此外,一旦翻译完成,原始语言文本将在网页的同一位置被翻译文本替换,变量'replacement'存储翻译文本--
var holder = document.createElement('span');
holder.innerHTML = replacement;
var child = holder.firstChild;
var ref = child.cloneNode(true);
// ... now insert into document in place of the original content:
range.deleteContents();
range.insertNode(ref);
while (child = child.nextSibling) {
ref.parentNode.insertBefore(child.cloneNode(true), ref.nextSibling);
ref = ref.nextSibling;
}
请注意,“范围”的初始化代码在此问题中显示的第一个代码部分中给出...
我该如何着手修改上述代码,以便在 iframe 中创建新的 span 元素?我的理解是,要做到这一点,关键部分是代码
var holder = document.createElement('span');
变量“holder”也应该能够在 iframe 中创建 span 元素......
如何修改此代码?
最佳答案
您应该引用 iframe
文档而不是当前的主要 文档
,从那里您可以确定实际选择了哪个文本。
function getIFrameDocument(iframe) {
var doc;
if (iframe.contentDocument) {
doc = iframe.contentDocument;
} else if (iframe.contentWindow) {
doc = iframe.contentWindow.document;
} else if (iframe.document) {
doc = iframe.document;
} else {
doc = window.frames[iframe.id].document;
}
return doc;
}
// try to get main document selection
var selection = document.getSelection();
if (!selection) {
selection = getIFrameDocument(document.getElementById('your-iframe-id')).getSelection();
}
请注意,这是未经测试的,但这个想法是有道理的。
关于javascript - 修改 javascript 代码,使其在 iframe 中获取当前选定的文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7793887/