javascript - e.target 只处理链接

标签 javascript jquery html css google-chrome-extension

我是菜鸟,我正在开发一个chrome插件,它提供了关于在网页中点击的元素的信息,

它工作正常,但问题是 e.target 仅适用于链接和输入框,但是当我单击某些文本时它什么也没做,它是空白的[预期:id/class/etc 文本所在的 div]

这是我的代码(请不要标记我,因为我真的很陌生):

document.addEventListener("click", function (e) {
    var dom_id    = e.target.getAttribute("id");
    var dom_name  = e.target.name.toString();
    var dom_class = e.target.className.toString();
    var dom_html  = e.target.innerHTML;
    var dom_href  = e.target.getAttribute("href");
    var dom_text  = e.target.text;
    var dom_el    = e.target.tagName;
    var dom_src   = e.target.src;
}, false);

我想要的只是当我点击一个 div 时,我应该得到 div 信息,span 应该给出 span 信息,类似地等等。

最佳答案

问题

因为(基于 another question 你的)似乎听众注册正确(例如,在加载 DOM 之后,我看到的唯一问题是你正在调用 e.target.name.toString();.

解释

它仅适用于具有 name 属性集的元素(不仅适用于链接或输入,而且适用于任何具有 name 属性的元素)。对于没有 name 的元素,将引发异常,因为您正在调用 undefined 的方法 toString (e.target.name 当缺少 name 属性时等于 undefined
(请注意,className 不是这种情况,因为 className 指的是元素属性(不直接是 class 属性,它当缺少 class 属性时默认为空字符串。)

解决方案

只需删除 .toString() 部分即可:

var dom_name = e.target.name;

<子> 根据您稍后使用该 var 的方式,您可能需要添加一个检查并将其设置为空字符串(如果未定义):
var dom_name = (e.target.name !== undefined) ? e.target.name : '';

关于javascript - e.target 只处理链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20465831/

相关文章:

javascript - 如何捕获终端中显示的 Protractor 错误消息

javascript - React 内部的不变违规错误

javascript - 番茄钟: resume button not working

javascript - 添加到父 iframe(body) 的单击事件在子 iframe(body) 中不起作用

javascript - 使用多个复选框过滤具有数据属性的 div

javascript - 对 JavaScript 中的闭包感到困惑

javascript - Primefaces 不显示 css 和 js

asp.net - 基于 Ajax 的大数据仪表板

javascript - createJS 标签 HitTest

html - Div 100% 长度变形 Bootstrap 模式对话框