Regardez ce code:
<div>
<a href = "#"><span>Click me MAN !</span></a>
</div>
<script type = "text/javascript">
window.onload = function () {
document.body.addEventListener ("click", function (event) {
var target = event.target;
alert ("Returns \"" + target.nodeName + "\". Just want \"" + target.parentNode.nodeName + "\"")
}, false);
}
</script>
3 Réponses :
Vous ne pouvez pas simplement utiliser
<span><a href="#">Click me</a></span> ?
Quel est le point de la portée alors? Cela devient complètement inutile.
Comment pour toi figure? Les styles appliqués sur elle sont toujours valables pour le contenu du lien ...
Avec votre approche, vous devez soit traverser manuellement le DOM jusqu'à ce que vous appuyez sur un élément Minimiser le nombre d'auditeurs d'événements est généralement une bonne idée, alors voici un exemple de comment traverser le DOM. Notez que l'écouteur d'événement ne fonctionnera pas dans IE, qui ne prend pas en charge la méthode Exemple en direct: http://jsfiddle.net/timdown/pjp4j/ ou joindre l'écouteur au lien lui-même et utilisez-le ceci . AddeventListener () de nœuds DOM.
Ajoutez les conseils CSS pour JavaScript. Vous obtiendrez événement.Target que vous voulez.
a > *,
button > *{
pointer-events:none;
}
Pourquoi vous écoutez-vous exactement pour un clic sur le corps au lieu de cibler simplement la balise d'ancrage?
@Matt: C'est une bonne idée de réduire au minimum les gestionnaires d'événements et d'utiliser le fait que la plupart des événements bouillonnent l'arbre Dom, une technique appelée délégation d'événement . Cela peut être ce que fait l'OP.