如何让元素被点击(对于整个文档)?

我想在我点击的HTML文档中获得当前元素(无论那是什么元素)。我正在使用:

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

但非常奇怪的是，我得到的是整个(!)文档的文本，而不是单击的元素。

如何只得到我点击的元素?

例子

<body>
<div class="myclass">test</div>
<p>asdfasfasf</p>
</body>

如果我点击“测试”;文本，我希望能够读取属性与$(this).attr("myclass")在jQuery。

455742 次浏览
小开

你可以在event.target中找到目标元素:

$(document).click(function(event) {
console.log($(event.target).text());
});

引用:

小开 
$(document).click(function (e) {
alert($(e.target).text());
});
小开
最佳答案

你需要使用event.target，它是最初触发事件的元素。示例代码中的this指的是document。

在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);

此外，确保你是否需要支持<IE9，你使用attachEvent()而不是addEventListener()。

小开

使用delegate和event.target。delegate通过让一个元素监听并处理子元素上的事件来利用事件冒泡。target是event对象的jq规范化属性，它表示事件产生的对象。

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

演示:http://jsfiddle.net/xXTbP/

小开

在body标签中使用以下代码

<body onclick="theFunction(event)">

然后在javascript中使用下面的函数来获取ID

<script>
function theFunction(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来获取element

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(e.target);
console.log(e.target.id, ' -->', e.target.innerHTML);
}
小开

这是javascript中最简单的获取点击元素的方式。

window.addEventListener('click', (e) => console.log(e.target));

提交答案