Javascript 我单击时选择了多个元素，现在我只需要其中一个（单击类似于浏览器中的检查器的功能）

我目前在

$（“body*”）

上有一个jquery选择器，这样当我单击某个地方时，我就可以得到页面中被单击的元素。我也知道为什么返回的元素不止一个。（例如：如果我单击一个按钮，所有父元素都会发生单击事件并被触发）

我的问题是：我想要一个像Inspector一样的点击功能。我只想要我想要点击的元素。当我查看日志时，在日志中我输出了所有单击的元素，我注意到我想要单击的元素总是第一个写入控制台的元素。所以我的第一个想法是，除去第一个元素之外的所有元素，但我不知道如何将它们分开。如何从

$（this）

访问和编辑/删除所有单击的元素

或者有没有其他更好的方法来获取单击的元素

代码和图像：

$("body *").click(function (e) {
    console.log($(this));
});

现在，树上图像中的所有元素都写入控制台

---

我刚刚找到了解决办法。在我的

单击

函数中，我可以只说

e.stopPropagation

，以防止jquery在树/dom上行走，并在父级上开火

完整解决方案：

$("body *").click(function (e) {
    e.stopPropagation();
    console.log($(this));
});

编辑：另一个解决方案显示了Pango。不必给页面上的每个元素一个EventListener，您可以只给

body

元素一个EventListener，然后查看事件的目标。这将返回正确的单击元素

$('body').on('click', function(e) {
    console.log(e.target); // target
    console.log($(this)); // body
});

---

这是一个更干净的解决方案，因为只有一个EventListener。当您希望在不影响其他脚本中的EventListener的情况下删除这些脚本时，这一点非常重要。在我的例子中，我有一个切换按钮，可以激活一个元素高亮显示器（比如来自inspector的），我可以单击一个元素，然后将它与另一个元素进行比较。因此，当我选择完2个元素后，我需要停用/删除这些侦听器。有了这个解决方案，就容易多了。

我刚刚找到了解决方案。在我的

单击

函数中，我可以只说

e.stopPropagation

，以防止jquery在树/dom上行走，并在父级上开火

完整解决方案：

$("body *").click(function (e) {
    e.stopPropagation();
    console.log($(this));
});

编辑：另一个解决方案显示了Pango。不必给页面上的每个元素一个EventListener，您可以只给

body

元素一个EventListener，然后查看事件的目标。这将返回正确的单击元素

$('body').on('click', function(e) {
    console.log(e.target); // target
    console.log($(this)); // body
});

---

这是一个更干净的解决方案，因为只有一个EventListener。当您希望在不影响其他脚本中的EventListener的情况下删除这些脚本时，这一点非常重要。在我的例子中，我有一个切换按钮，可以激活一个元素高亮显示器（比如来自inspector的），我可以单击一个元素，然后将它与另一个元素进行比较。因此，当我选择完2个元素后，我需要停用/删除这些侦听器。有了这个解决方案，它就容易多了。

我想您正在寻找实际单击的元素

编辑：

$('body').on('click', function(e) {
    console.log(e.target); // target
    console.log($(this)); // body
});

---

该代码将向主体附加一个click事件处理程序。该事件将只触发一次，而不是像使用“body*”选择器时那样针对每个父级触发一次。然后，您可以使用$（e.target）获取实际单击的内容，$（this）将是主体，不需要处理额外的父元素。

我想您正在查找实际单击的元素

编辑：

$('body').on('click', function(e) {
    console.log(e.target); // target
    console.log($(this)); // body
});

---

该代码将向主体附加一个click事件处理程序。该事件将只触发一次，而不是像使用“body*”选择器时那样针对每个父级触发一次。然后，您可以使用$（e.target）来获取实际点击的内容，$（this）将成为主体，不需要处理额外的父元素。

您可以将演示放在JSFIDLE中吗？或者等等，这样我们就可以看一看了？你能展示一些html+脚本代码吗？你能在JSFIDLE中放一个演示吗？或者等等，这样我们就可以看一看了？您可以显示一些html+脚本代码吗？

事件。target

将为我提供正确的元素，但这会发生在所有选定的元素上。图片的父对象通常会返回自己，并带有

事件。target

我会为每个父对象获取我真正单击的元素。如果你看我帖子中的图片，现在会为每个元素都写上正确的元素。哦，好吧，一开始我误解了你的问题。我不确定您的用例是什么，如果您希望所有这些项目都应用单击事件，但是，您也可以通过将单击事件附加到正文并获取e.target来实现这一点（如果我理解正确）。例如：

$（'body'）.on（'click'，函数（e）{console.log（e.target）；//target console.log（$（this））；//body}）这也可以工作。好主意。澄清一下：我想做一个chrome扩展，您可以在其中选择一个元素，然后将其与另一个元素进行比较。编辑：这可能更好，因为当我关闭分机的弹出窗口时，我必须删除选择器…好的，我对这里的礼仪有点陌生，但我想我应该为后代更新我的答案？哦，是的。你应该这样做。我还将为您和您的解决方案命名为
事件。target
将为我提供正确的元素，但这会发生在所有选定的元素上。图片的父对象通常会返回自己，并带有
事件。target
我会为每个父对象获取我真正单击的元素。如果你看我帖子中的图片，现在会为每个元素都写上正确的元素。哦，好吧，一开始我误解了你的问题。我不确定您的用例是什么，如果您希望所有这些项目都应用单击事件，但是，您也可以通过将单击事件附加到主体并