如何使用Jquery / JavaScript完全删除canvas元素？

Question

我有一个canvas对象，可以从jQuery插件动态加载到我的页面上。它没有包装器，没有与之关联的id或类。但是之后我需要删除它

$(window).resize(function)() {...} 

发生了。我尝试过使用jQuery

...next().remove(); 

技术，以便相邻的div元素可以从DOM中删除它，但我遇到了问题。特别是，我的页面上的其他元素也被删除。对此有健康的解决方法吗？

谢谢！

Answer 1

如果您不使用多个画布元素，只需

$('canvas').remove();

将删除页面上所有匹配的元素。 http://jsfiddle.net/vj6NP/

如果页面上有多个画布并且只想删除一个画布，则可以使用nth-of-type选择要删除的画布。

例如，删除第一个实例http://jsfiddle.net/vj6NP/3/： -

$('canvas:nth-of-type(1)').remove();

Answer 2

您在页面上有多少个画布元素？如果只有一个;并且你不打算在将来添加任何它可能是最简单的

var dynamic_canvas = $('canvas');
if(dynamic_canvas) dynamic_canvas.remove();

Answer 3

最简单的方法是保持对添加到文档的canvas元素的引用，然后使用JQuery删除它：

this.canvas = document.createElement('canvas');
//later...
$(this.canvas).remove();