Question

Je les codes suivants pour créer dojos un élément graphique de surface sous div:

....
<script type=text/javascript>
....
   function drawRec(){
      var node = dojo.byId("surface");
      //   remove all the children graphics
      var surface = dojox.gfx.createSurface(node, 600, 600);

      surface.createLine({
         x1 : 0,
         y1 : 0,
         x2 : 600,
         y2 : 600
      }).setStroke("black");
   }
....
</script>
....
<body>
<div id="surface"></div>
....

drawRec() dessinera un graphique rectangle première fois. Si je l'appelle à nouveau cette fonction dans un href d'ancrage comme ceci:

 <a href="javascript:drawRec();">...</a>

il dessinera un autre graphique à nouveau. Ce que je dois nettoyer tous les graphiques sous la div puis créer à nouveau. Comment puis-je ajouter des codes de dojo pour le faire?

Était-ce utile?

La solution

while (node.hasChildNodes()) {
    node.removeChild(node.lastChild);
}

Autres conseils

node.innerHTML = "";

non standard, mais rapide et bien pris en charge.

Tout d'abord, vous devez créer une surface une fois et le garder à portée de main quelque part. Exemple:

var surface = dojox.gfx.createSurface(domNode, widthInPx, heightInPx);

domNode est habituellement un <div> dépouillé, qui est utilisé comme un espace réservé pour une surface.

Vous pouvez effacer tout sur la surface en une seule fois (tous les objets de forme existants seront invalidés, ne les utilisez pas après):

surface.clear();

Toutes les fonctions et les méthodes liées à surface se trouvent dans la documentation officielle sur dojox.gfx.Surface . Des exemples d'utilisation se trouvent dans dojox/gfx/tests/.

while(node.firstChild) {
    node.removeChild(node.firstChild);
}

Dojo 1.7 ou plus récent, utilisez dojo.empty(String|DomNode) (dépréciée au Dojo 1.8 ):

dojo.empty( id or DOM node );

Chacune de ces méthodes de empty supprime en toute sécurité tous les enfants du nœud.

De l'API :

dojo.html._emptyNode(node);

Si vous êtes à la recherche d'un moyen> 1.7 Dojo moderne de détruire tous les enfants de ce nœud est le chemin:

// Destroys all domNode's children nodes
// domNode can be a node or its id:
domConstruct.empty(domNode);
  

en toute sécurité vide le contenu d'un élément DOM. vide () supprime tous les enfants, mais maintient le nœud là.

Consultez la documentation "dom-construction" pour plus de détails.

// Destroys domNode and all it's children
domConstruct.destroy(domNode);
  

détruit un élément DOM. destroy () supprime tous les enfants et le nœud lui-même.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top