Удалите все дочерние элементы DOM в div - PullRequest
Новая
       58

Удалите все дочерние элементы DOM в div

121 голосов
/ 25 марта 2009

У меня есть следующие коды Dojo для создания элемента поверхности графика под 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() впервые нарисует прямоугольную графику. Если я вызову эту функцию снова в привязке, как это: 

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

это снова нарисует другую графику. Что мне нужно очистить всю графику под div и затем создать заново. Как я могу добавить несколько кодов додзё для этого?

Ответы [ 7 ]

277 голосов
/ 26 марта 2009 
while (node.hasChildNodes()) {
    node.removeChild(node.lastChild);
}
44 голосов
/ 26 марта 2009 
node.innerHTML = "";

Нестандартный, но быстрый и хорошо поддерживаемый.

25 голосов
/ 26 марта 2009

Прежде всего вам нужно создать поверхность один раз и держать ее где-нибудь под рукой. Пример: 

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

domNode обычно является неукрашенным <div>, который используется в качестве заполнителя для поверхности.

Вы можете очистить все на поверхности за один раз (все существующие объекты фигур будут признаны недействительными, не используйте их после этого): 

surface.clear();

Все функции и методы, связанные с поверхностью, можно найти в официальной документации по dojox.gfx.Surface . Примеры использования можно найти в dojox/gfx/tests/.

19 голосов
/ 02 марта 2010

В Dojo 1.7 или новее используйте domConstruct.empty(String|DomNode): 

require(["dojo/dom-construct"], function(domConstruct){
  // Empty node's children byId:
  domConstruct.empty("someId");
});

В старом Dojo используйте dojo.empty(String|DomNode) (не рекомендуется в Dojo 1.8): 

dojo.empty( id or DOM node );

Каждый из этих empty методов безопасно удаляет все дочерние элементы узла.

19 голосов
/ 26 марта 2009 
while(node.firstChild) {
    node.removeChild(node.firstChild);
}
3 голосов
/ 18 февраля 2014

Если вы ищете современный> 1.7 способ уничтожить все дочерние узлы в Додзе, то это путь: 

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

Безопасное удаление содержимого элемента DOM. empty () удаляет все дочерние элементы, но сохраняет там узел.

Более подробную информацию смотрите в документации "dom-construct". 

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

Уничтожает элемент DOM. destroy () удаляет все дочерние элементы и сам узел.

3 голосов
/ 26 марта 2009

Из документации по API Dojo Документация : 

dojo.html._emptyNode(node);
...