Javascript 如何单击元素（对于整个文档）？_Javascript_Jquery_Html_Dom

Javascript 如何单击元素（对于整个文档）？

javascript jquery html dom

Javascript 如何单击元素（对于整个文档）？,javascript,jquery,html,dom,Javascript,Jquery,Html,Dom,我想在我单击的HTML文档中获取当前元素（无论是什么元素）。我正在使用： $(document).click(function () { alert($(this).text()); }); 但很奇怪，我得到的是整个（！）文档的文本，而不是单击的元素如何仅获取我单击的元素例子测试 asdfasfasf 如果单击“测试”文本，我希望能够在jQuery中使用$（this）.attr（“myclass”）读取属性。您可以在以下位置找到目标元素：参考资料：您需要使用最初触发事

我想在我单击的HTML文档中获取当前元素（无论是什么元素）。我正在使用：

$(document).click(function () {
    alert($(this).text());
});

但很奇怪，我得到的是整个（！）文档的文本，而不是单击的元素

如何仅获取我单击的元素

例子


测试
asdfasfasf

如果单击“测试”文本，我希望能够在jQuery中使用

$（this）.attr（“myclass”

）读取属性。

您可以在以下位置找到目标元素：

参考资料：

您需要使用最初触发事件的元素。示例代码中的

此

指的是

文档

在jQuery中，这是

$(document).click(function(event) {
    var text = $(event.target).text();
});

没有jQuery

document.addEventListener('click', function(e) {
    e = e || window.event;
    var target = e.target || e.srcElement,
        text = target.textContent || target.innerText;   
}, false);

此外，如果需要支持attachEvent（）而不是

addEventListener（）

使用和

delegate

通过让一个元素侦听和处理子元素上的事件来利用事件冒泡

target

是

事件

对象的jQ规范化属性，表示事件起源的对象

$(document).delegate('*', 'click', function (event) {
    // event.target is the element
    // $(event.target).text() gets its text
});

演示：

在body标签内使用以下内容

<body onclick="theFunction(event)">

然后在javascript中使用以下函数获取ID

<script>
function theFunction(e)
{ alert(e.target.id);}


函数函数（e）
{alert（e.target.id）；}

这里有一个使用jQuery选择器的解决方案，这样您就可以轻松地将任何类、ID、类型等标记作为目标

jQuery('div').on('click', function(){
    var node = jQuery(this).get(0);
    var range = document.createRange();
    range.selectNodeContents( node );
    window.getSelection().removeAllRanges();
    window.getSelection().addRange( range );
});

event.target

获取

元素
window.onclick = e => {
    console.log(e.target);  // to get the element
    console.log(e.target.tagName);  // to get the element tag name alone
} 

从单击的元素中获取文本
window.onclick = e => {
    console.log(e.target.innerText);
} 

我知道这篇文章确实很老，但是，为了获取元素的内容，参考其ID，我会这样做：
window.onclick=e=>{
console.log（如target）；
log（e.target.id，'-->'，e.target.innerHTML）；
}
处理函数在添加到的元素范围内执行，这里是文档。您需要获取事件对象的target
属性。应该在这一天和这一年龄段中提到on（）
应该建议优于delegate（）
。另外，document
可能是唯一不使用delegate（）
/on（）
的例外，因为它们正在冒泡到处理的最高点。很好的调用。在我的日常工作中，我们还没有升级到最新的jQuery，所以我忘记了

上的

。@alex，既然事件一直在冒泡，而且不管怎样处理程序都必须运行，所以它实际上不是一个例外，是吗？只是没什么不同而已。我想<代码>委托<代码>确实有过滤开销要考虑……我发现返回的元素在某种程度上略有不同，所以我不能做<代码>（Endo.Task=＝MyjQueReDelvices）< /C>我必须这样做：<代码> IF（事件.Task.HasCype（MyDeCype））

其中mydivclass是我的元素拥有的一个类。我在Safari中寻找解决方案已经三天了，最后我偶然发现了这篇文章。你们太棒了thanks@alex嘿，它应该是

| target.innerText

？我来这里是为了右键单击，所以我尝试了右键单击，但没有成功。

jQuery('div').on('click', function(){
    var node = jQuery(this).get(0);
    var range = document.createRange();
    range.selectNodeContents( node );
    window.getSelection().removeAllRanges();
    window.getSelection().addRange( range );
});

window.onclick = e => {
    console.log(e.target);  // to get the element
    console.log(e.target.tagName);  // to get the element tag name alone
}

window.onclick = e => {
    console.log(e.target.innerText);
}