enlever un div par un événement onclick

Question

J'essaie d'enlever un div avec un événement onclick mais ça ne marche pas et la div reste là, en bas est le code que j'utilise, n'importe qui peut aider?

<div id="apDiv2"> 
    <a href="#" onclick="document.getElementById('apDiv2').removeChild(document.getElementById('apDiv1'))"> 
     <div id="apDiv1"></div> 
    </a> 
</div> 

Answer 1

Essayez ceci:

<div id="apDiv2"> 

<a href="#" onclick="this.removeChild(this.firstChild)"><div id="apDiv1">T</div></a> 

</div> 

• removeChild() supprime seul un enfant direct.

• J'ai aussi fait un peu le code plus propre:

  • this références tag de l'événement lui-même (dans ce cas, la balise <a>)
  • this.firstChild points au premier enfant de la balise link: le <div id="apDiv1">

Soit dit en passant, s'il vous plaît jeter un oeil dans la console développeur de votre navigateur (e .g. F12 dans Chrome) la prochaine fois. Vous auriez vu un eror que vous pourriez poster ici. Il aidera les gens à vous aider;)

---

Une façon encore meilleure serait de mettre le JavaScript dans son propre fichier (ou au moins dans un bloc) et d'utiliser les ID pour référencer les éléments.

Je donnerais le lien un autre ID, disons par exemple myLink:

document.getElementById("myLink").addEventListener("click", function() { 
    this.removeChild(this.firstChild); 
}); 

Si vous ne pouvez pas spécifier un ID pour la balise de lien, il existe plusieurs façons pour utiliser le apDiv2 extérieur comme point de référence, par exemple:

var linkTag = document.querySelector("#apDiv2 a"); 
// or 
var linkTag = document.getElementById("apDiv2").getElementsByTagName("a")[0];