您如何从Google Chrome扩展程序访问网页的事件侦听器？ [英] How can you gain access to a web page's event listeners from a Google Chrome extension

问题描述

我正在编写一个Chrome扩展程序，以列出附加到< a /> 标记的每个事件处理程序的源代码。 / p>

目前，我已经打印出href属性 - $（this）.attr（href） - 这工作正常。源代码位于 http://github.com/grantyb/Google当我扩展它来访问事件处理函数时，$（this）.data（events）返回null 。我确信我的< a /> 标记有一个click（）处理函数，因为当我输出 $（a ）.data（events）在我的网页中，它正确地列出了处理程序。

看来jQuery的 data（）方法正在检查沙箱中的数据，所以我无法从我的Extension中访问它。这很有意义，因为我猜它存储在 jQuery 全局变量中，这显然是与 jQuery 不同的变量。全球，住在我的扩展。

是否有另一种方式访问​​DOM中的对象的事件处理程序的列表。事件处理程序是否存储在DOM中？

解决方案

解决 >

查看GitHub上的代码以获取详细信息： http://github.com/grantyb/Google-Chrome-Link-URL-Extension 。

内容脚本使用jQuery追加一个< script> 标签直接插入主页面（插入疯狂的笑声）。 寄生虫脚本在主机页面上具有完整的可见性，包括DOM和JavaScript沙箱，因为它现在是页面的一部分。它获取我需要的数据，将其编码成文本格式，并将其写入到我之前准备的元素属性中。

然后，我坐下来等待（ setTimeout（...，10））以便脚本执行其业务。当我回电话时，我会自己清理并直接从DOM元素中获取文本编码的数据。

有没有简单的方法？这感觉很顽皮。

I'm writing a Chrome extension to list out the source code for each event handler attached to an <a/> tag when you roll over it.

Currently, I've printed out the href attribute - $(this).attr("href") - and this works fine. The source code is on github at http://github.com/grantyb/Google-Chrome-Link-URL-Extension.

When I extend it to access event handlers, $(this).data("events") returns null. I'm certain that there is a click() handler for my <a/> tag, because when I output $("a").data("events") inside my web page, it correctly lists the handler.

It seems that jQuery's data() method is checking data that is sandboxed, so I can't access it from inside my Extension. That makes sense, since I guess it's stored within the jQuery global variable, and that's clearly a different variable from the jQuery global that lives inside my Extension.

Is there another way to access the list of event handlers for an object in the DOM. Are event handlers even stored in the DOM?

解决方案

Solved with a terrific hack!

Check out the code on GitHub for the details: http://github.com/grantyb/Google-Chrome-Link-URL-Extension.

The Content Script uses jQuery to append a <script> tag directly into the host page (insert maniacal laugh here). The "parasite" script has complete visibility over the host page, including DOM and javascript sandbox, since it is now a part of the page. It fetches the data I need, encodes it into a text format and writes it into an attribute of an element that I prepared earlier.

Then, I sit back and wait (setTimeout(...,10)) for the script to do its business. When I get called back, I clean up after myself and grab the text-encoded data straight out of the DOM element.

Is there an easier way? This feels naughty.

这篇关于您如何从Google Chrome扩展程序访问网页的事件侦听器？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！