Div에서 모든 어린이 Dom 요소를 제거하십시오

StackOverflow https://stackoverflow.com/questions/683366

  •  22-08-2019
  •  | 
  •  

문제

나는 div에서 표면 그래픽 요소를 만들기위한 다음 dojo 코드가 있습니다.

....
<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() 처음으로 사각형 그래픽을 그립니다. 이 기능을 다시 호출하면 다음과 같은 앵커 href로 호출합니다.

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

다른 그래픽을 다시 그립니다. DIV 아래의 모든 그래픽을 청소 한 다음 다시 작성해야합니다. DOJO 코드를 추가하려면 어떻게해야합니까?

도움이 되었습니까?

해결책 

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

다른 팁

node.innerHTML = "";

비표준이지만 빠르고 잘 지원됩니다.

우선 당신은 한 번 표면을 만들어 편리하게 유지해야합니다. 예시:

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

domNode 일반적으로도 태어나지 않습니다 <div>, 이것은 표면의 자리 표시 자로 사용됩니다.

한 번에 표면의 모든 것을 지울 수 있습니다 (모든 기존 모양 객체는 무효화됩니다. 그 후에는 사용하지 마십시오) :

surface.clear();

모든 표면 관련 기능 및 방법은 공식 문서에서 찾을 수 있습니다. dojox.gfx.surface. 사용의 예는 찾을 수 있습니다 dojox/gfx/tests/.

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

Dojo 1.7 또는 새로 사용하십시오 domConstruct.empty(String|DomNode):

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

오래된 도조에서는 사용하십시오 dojo.empty(String|DomNode) (Dojo 1.8에서 감가 상각됨) :

dojo.empty( id or DOM node );

이들 각각 empty 방법은 노드의 모든 어린이를 안전하게 제거합니다.

도조 API에서 선적 서류 비치:

dojo.html._emptyNode(node);

모든 노드의 어린이를 파괴하는 현대> 1.7 도조 방법을 찾고 있다면 다음과 같습니다.

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

DOM 요소의 내용을 안전하게 비우십시오. 빈 ()은 모든 어린이를 삭제하지만 노드를 유지합니다.

자세한 내용은 "Dom-Construct"문서를 확인하십시오.

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

DOM 요소를 파괴합니다. 파괴 ()는 모든 어린이와 노드 자체를 삭제합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top