javascript - Hvordan få tak i elementet som ble klikket (for hele dokumentet)?

Jeg vil gjerne få det gjeldende elementet (uansett hvilket element det er) i et HTML-dokument som jeg klikket på. Jeg bruker:

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

Men veldig merkelig, jeg får teksten til hele(!) dokumentet, ikke det klikkede elementet.

Hvordan få tak i bare elementet jeg klikket på?

Eksempel

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

Hvis jeg klikker på teksten «test», vil jeg kunne lese attributten med $(this).attr("myclass") i jQuery.

Svar #1

Du må bruke event.target, som er elementet som opprinnelig utløste hendelsen. this i eksempel-koden din refererer til document.

I jQuery er det...

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

Uten jQuery...

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

Sørg også for at hvis du trenger å støtte < IE9, at du bruker attachEvent() i stedet for addEventListener().

Svar #2

event.target for å få element

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

å hente teksten fra klikket element

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

Svar #3

bruk følgende inne i body-tagen

<body onclick="theFunction(event)">

bruk deretter følgende funksjon i JavaScript for å få ID-en

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

Svar #4

Du kan finne mål-elementet i event.target:

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

Referanser: