[英]Remove all the children DOM elements in div
我有以下 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()将第一次绘制矩形图形。 如果我在这样的锚点 href 中再次调用此函数：
<a href="javascript:drawRec();">...</a>
它将再次绘制另一个图形。 我需要清理div下的所有图形，然后再次创建。 我如何添加一些道场代码来做到这一点？
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 中，使用dojo.empty(String|DomNode) （在 Dojo 1.8 中已弃用）：
dojo.empty( id or DOM node );
这些empty方法中的每一个都会安全地删除节点的所有子节点。
来自 dojo API 文档：
dojo.html._emptyNode(node);
如果您正在寻找一种现代的 >1.7 Dojo 销毁所有节点的子节点的方式，可以这样做：
// Destroys all domNode's children nodes
// domNode can be a node or its id:
domConstruct.empty(domNode);
安全地清空 DOM 元素的内容。 empty() 删除所有子节点，但将节点保留在那里。
// Destroys domNode and all it's children
domConstruct.destroy(domNode);
销毁 DOM 元素。 destroy() 删除所有子节点和节点本身。
const wipeOut = elm => [...elm.childNodes].forEach(child => child.remove());
wipeOut(elm);
除了一个div和子节点之外，如何选择DOM中的所有元素
[英]How to select all elements in DOM apart from one div and the children
我如何使用 jQuery 删除除特定 class 之外的所有 div 和其他 DOM HTML 元素
[英]How can i remove all div's and other DOM HTML elements except a particular class using jQuery
Javascript DOM批处理仅通过2个DOM调用即可添加/删除/编辑元素和子元素
[英]Javascript DOM batch add/remove/edit elements & children with only 2 DOM calls
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.