GMail：在每个附件下载链接旁边添加一个链接

Question

我正在开发一个 chrome 扩展，其目的是向 gmail 中的每个附件添加“导出到 gdocs”链接。

我已经实现了部分代码，成功地将链接添加到“下载”链接旁边，但我遇到了一个不知道如何解决的问题。

问题是：在邮件线程（有多个回复）中，折叠的邮件不受我的脚本的影响 - 并且当它们展开时，链接（如预期）未添加。

发生这种情况的原因是折叠的邮件在运行时展开时加载 - 因此当我的脚本在页面加载时执行时，没有可添加的链接，因为邮件内容尚未加载。

我尝试使用原型框架和我在此处找到的示例代码添加更新处理程序：

http://groups.google.com/group/prototype-scriptaculous/browse_thread/thread/5ad539212ea07716?pli=1（最后一篇文章）

http://jsbin.com/utuvu

但它不起作用 - 尽管解决方案本身是有效的并且可以在 gmail 中运行。

部分工作的解决方案是使用 chrome.tabs onUpdate 监听器（在后台文件中注册）和一些 jquery（作为内容脚本注入）来实现的：

选择具有“cr hf”css 类的表（这些类用于包含附件链接）

$('table.cf.hr').each(function() {
    injectLink($(this));
});

对于每个，查找下载链接，从下载 URL 中提取一些参数， 创建一个新链接并添加到最后一个链接旁边

function injectLink(table) {
    var downloadLink = table.find("td:last a:last");
    var exportToGdocsLink = downloadLink.clone().attr(...)...
    ...
    downloadLink.after(exportToGdocsLink).after("<span>&nbsp;&nbsp;&nbsp;</span>");
}

有人实现了与 gmail 交互的 chrome 扩展吗？有什么提示可以让我弄清楚如何继续吗？

更新

最新版本的代码是这样的：

$('#canvas_frame').ready(function() { 
    var doc = frames['canvas_frame'].contentDocument; 
    $(doc).find('table.cf.hr').livequery(function() { 
        injectLink($(this)); 
    }); 
}); 

但我尝试了几种“组合” - 这是“最接近预期”的结果。 canvas_frame 是包含整个 gmail 界面的 iframe。具有 css 类 cr hf 的表包含附件链接。

谢谢 安东尼奥

Answer 1

仅当您捕获事件时 .live() 才会有帮助。

您可以使用 live query jquery 插件检测元素创建。

纯 javascript 解决方案将监听 DOMSubtreeModified 或 DOMNodeInserted 每当 DOM 更改时就会触发的事件（只需小心，因为一次可能有数百个事件）。