Détruire/supprimer une area

**Kalseln** · 01/03/2008, 16h37

Bonjour,

Je cherche désespérément la syntaxe pour détruire ou supprimer ou effacer de la page une area.

**julien.63** · 01/03/2008, 17h12

salut,
je ne sais pas vraiment ce que tu appelles une area.
Mais pour cacher un élément d'une page tu peux utiliser

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

tonElement.style.display ="none";

ou

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

tonElement.style.visibility="hidden";

**Kalseln** · 01/03/2008, 17h34

Une <area...> c'est une zone définie par des positions et qui doit faire partie d'une balise <map...> qui elle même fait référence à une image. Utile pour faire des zones cliquables d'autres formes que carrées. Voici une de mes zones octogonales :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<area shape="poly" coords="336,194,383,188,419,205,406,229,359,235,324,218" />

Ce que j'essaie de faire c'est un "onclick" qui commence par enlever la possibilité de recliquer sur la même zone ou une autre zone. Donc j'avais pensé à supprimer carrément la zone ou enlever le href des zones mais je ne trouve pas comment faire.

J'ai essayé par exemple

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.delete();

ça ne fait rien.

Je viens d'essayer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

this.style.display ="none";

ça ne marche pas non plus.

**Auteur** · 01/03/2008, 18h20

display et visibility sont des attributs pour afficher ou cacher un élement.

Le mieux est de supprimer le noeud en utilisant removeChild().

**Kalseln** · 02/03/2008, 13h52

ça m'a l'air d'être une bonne piste, merci pour vos réponses au fait.
Mais est-ce que tu pourrais me donner un exemple de suppression d'une div par exemple ? ou si tu connais un site qui en parle ...
Je n'arrive à trouver que des exemples avec removeChild() de suppression d'éléments dans un "select".

Edit:
Non c'est bon j'ai trouvé comment ça marche. Exemple avec des divs :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<div id="b">
  <div id="a" style="left:100px;top:100px;height:50px;width:50px;background-color:blue;"></div>
</div>
 
<a href="#" onclick="document.getElementById('b').removeChild(document.getElementById('a'));">Supprimer la zone</a>

Il ne me reste plus qu'à adapter pour mes area (que je génère grâce à 4 boucles for...)

**Auteur** · 02/03/2008, 19h31

supprime ton area comme tu supprimes ton div

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
function supprArea()
{
    var noeudAera = document.getElementById("idPoly");
    document.getElementById("ImageMap").removeChild(noeudAera);
}
//-->
</script>
 
</head>
 
<body>
 
<img src="map.jpg" style="width:200px; height:200px; border: none" usemap="#map" />
 
<map id="ImageMap" name="map">
    <area shape="rect" coords="21,20,48,104" alt="Rectangle" href="http://www.page.htm" />
    <area shape="circle" coords="45,162,27" alt="Cercle" href="http://www.page.htm" />
    <area id="idPoly" shape="poly" coords="78,68,77,61,114,48,114,141,132,141,132,146,83,146,84,138,100,139,101,58" alt="Polygone" href="http://www.page.htm" />
</map>
 
<br />
<input type="button" value="Bouton" id="idButton" onclick="supprArea()" />
 
 
</body>
 
</html>

Après le clic sur le bouton, l'area polygone n'existe plus

Petite parenthèse : les options du select ne sont pas supprimées avec removeChild(). L'objet select possède ses propres fonctions d'ajout et suppression des options

Détruire/supprimer une area

JavaScript

Vue hybride

Discussions similaires

Partager

Partager