Javascript 如何实现iframe元素选择器？（如铬合金）

我正在尝试让iframe有一个元素选择器，就像GoogleChrome中的那个。我没有在网上找到结果，但到目前为止，我的一些想法是可能创建一个脚本来创建临时单击事件侦听器，并删除任何HREF，这样它就不会重定向。不过，考虑到这需要大量替换和单击事件，这可能会对性能造成一些负担

这就是我试图在iframe中实现的内容：

---

当然，除了没有Inputer本身之外。

假设您可以修改iframe的内容，您可以向整个文档添加一个click事件监听器，以获取被单击的目标并阻止默认操作。然后可以使用目标，并设置其样式或显示有关它的信息

document.addEventListener( 'click', function( e ) {
    e.preventDefault();

    e = e || window.event;
    var target = e.target || e.srcElement;

    // now that you have the target and you've prevented
    // the default action such as redirecting to a href,
    // you can style the target or do whatever you want
    // to it.
    target.classList.add ( "selected" );

}, false );

这不应该是性能负担

如果无法修改iframe的内容，但iframe的内容与父页面来自同一域，则仍然可以使用jQuery函数将iframe的文档作为目标。您可以这样添加上面的事件侦听器：

var iframe = document.getElementById('your-iframe-id');
var iframe_doc = iframe.contentDocument || iframe.contentWindow.document;
iframe_doc.addEventListener( 'click', function( e ) {
    ...

如果iframe的内容不是来自父页面的域，那么您将遇到由跨域策略引起的错误。您可以通过使用服务器端代理绕过此问题，但这超出了本问题的范围

---

问题很广泛，但这可能会帮助你开始