检查Element for Chrome Extension？

Question

我需要能够或多或少地执行一个或更多的检查元素,以便能够在鼠标悬停时突出显示并保存特定的DOM元素.这与Google Chrome开发人员工具的"元素"标签或FireBug中的"HTML"标签同义.

我不需要显示DOM或像这些工具一样的窗格我只需要知道XPATH或DOM对象是什么,然后就可以在网页本身上突出显示(就像这些工具一样).这些工具当前在选中时会在元素上显示阴影.

我想在Chrome中最好这样做.有没有办法添加一个监听器？我玩了chrome.contextMenus.create,但是这不会让你访问该页面,或者告诉你你在哪里.那里的selectedText无用,以后再返回同一个DOM元素.

有没有人知道一个API,让你知道鼠标在哪里？

注意:我无权访问该页面.即作为扩展的原因是因为我正在检查第三方页面,而不是我可以控制的页面.

Answer 1

这是一项相当大的工作.使用jQuery,您可以设置鼠标悬停的元素,如下所示:

$("*").not("body, html").hover(function(e) {
   $(this).css("border", "1px solid #000"); 
   e.stopPropagation();
}, function(e) {
   $(this).css("border", "0px"); 
   e.stopPropagation();
});

获取xPath expresson是你必须自己做的事情,尽管你可能会发现firebug的实现是一个有用的资源.