假设我有
var myCanvas = document.createElement('canvas');
我也是
myCanvas.setAttribute("id", "my-canvas");
document.body.appendChild(myCanvas);
后记 我对 myCanvas
进行了更改,并希望用我更新的 DOM
Canvas 替换 html-canvas。以下作品:
document.getElementById("my-canvas").innerHTML = myCanvas;
但是 html(通过检查器)看起来像
<canvas id="my-canvas">[object HTMLCanvasElement]</canvas>
什么时候应该是这样
<canvas id="my-canvas"></canvas>
如何更新元素而不使用 innerHTML
?
最佳答案
您不必更新 myCanvas
如果它仍然是同一个节点。当您创建一个节点并将其附加到 DOM 时,DOM 节点事件。这意味着 myCanvas
上的所有更改将立即反射(reflect)在页面中。
替换子()
如果你想用不同节点替换一个节点,你可以使用.replaceChild()
在要替换的节点的父元素上。
示例:
document.getElementById("parent").replaceChild(element, newElement);
其中 parent
是 element
的父元素。
<div id="parent">
<canvas id="element"></canvas>
</div>
内部HTML
在您的问题中,您使用的是 innerHTML
.如果您只想用另一个元素的内容替换一个元素的内容,请对这两个元素使用 innerHTML
。
示例:
document.getElementById("element").innerHTML = newElement.innerHTML;
关于javascript - 使用 DOM Canvas 更新 Canvas 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8380411/