javascript dojo：通过 dom 节点销毁所有小部件
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4628116/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
dojo: destroy all widgets by dom node
提问by Ashley
My content is replaced with ajax but sometimes an element will have the same id on two pages (ie, a photo on the home page has the same id on the gallery page). This means that when dojo.parser.parse is called, the widgets are trying to be re-added, and the below error is thrown:
我的内容被 ajax 替换，但有时一个元素在两个页面上会具有相同的 id（即，主页上的照片在图库页面上具有相同的 id）。这意味着当 dojo.parser.parse 被调用时，小部件正在尝试重新添加，并抛出以下错误：
Error: Tried to register widget with id==____ but that id is already registered
Ideally, what I'd like to do is run destroyRecursive on the DOM node that the AJAX replaces. I've tried both of the below but neither work (I believe destroyRecursive is for widgets not DOM?):
理想情况下，我想做的是在 AJAX 替换的 DOM 节点上运行 destroyRecursive。我已经尝试了以下两种方法，但都没有奏效（我相信 destroyRecursive 用于小部件而不是 DOM？）：
dojo.byId('main').destroyRecursive();
dijit.byId('main').destroyRecursive();
Is there a good way of doing this, or do I need to try and ensure that all my id's are different?
有什么好的方法可以做到这一点，还是我需要尝试确保我的所有 ID 都不相同？
回答by Ken Franqueiro
You are on the right track, and you are correct that destroyRecursive only exists on widgets. However, there are a couple of choices to accomplish what you want to do.
你在正确的轨道上，你是正确的，destroyRecursive 只存在于小部件上。但是，有几种选择可以完成您想要做的事情。
If you're using widgets to a significant extent, and the div in question is regularly being used as a bucket to hold content including widgets, then I would highly recommend you have a look at dijit.layout.ContentPane. ContentPane is a widget primarily focused around the idea of a container that receives content, either directly or from a URL, which may or may not include widgets.
如果您在很大程度上使用小部件，并且有问题的 div 经常用作存储包括小部件在内的内容的存储桶，那么我强烈建议您查看dijit.layout.ContentPane. ContentPane 是一个小部件，主要围绕直接或从 URL 接收内容的容器的想法，其中可能包括也可能不包括小部件。
Right now you're probably doing something like this on each page change:
现在，您可能会在每次页面更改时执行以下操作：
dojo.xhrGet({
url: 'something.html',
load: function(html) {
dojo.byId('main').innerHTML = html;
dojo.parser.parse(dojo.byId('main'));
}
error: function(error) { ... }
});
With a ContentPane, you could do the same thing like this:
使用 ContentPane，你可以做同样的事情：
cp.set('href', 'something.html'); //use attr instead of set if < dojo 1.5
With this, ContentPane will not only fetch that URL and hold its contents - it will also parse any widgets within it - and equally importantly, it will automatically destroy any existing widgets within itself before it replaces its content.
这样，ContentPane 不仅会获取该 URL 并保存其内容——它还将解析其中的任何小部件——同样重要的是，它会在替换其内容之前自动销毁其内部的任何现有小部件。
You can read more about it in the Dojo documentation:
您可以在 Dojo 文档中阅读更多相关信息：
- http://dojotoolkit.org/reference-guide/dijit/layout/ContentPane.html
- http://dojotoolkit.org/api/dijit/layout/ContentPane
- http://dojotoolkit.org/reference-guide/dijit/layout/ContentPane.html
- http://dojotoolkit.org/api/dijit/layout/ContentPane
Alternatively, if you don't feel like using a widget to hold your content, you can look for widgets in your div and destroy them yourself. Here's the easiest way to do it:
或者，如果您不想使用小部件来保存您的内容，您可以在您的 div 中查找小部件并自行销毁它们。这是最简单的方法：
dojo.forEach(dijit.findWidgets(dojo.byId('main')), function(w) {
w.destroyRecursive();
});
回答by dacabdi
dojo.query('selector').forEach(function(node){
dijit.byNode(node).destroyRecursive(true);
});
Basically, selecting the node... You can get the mapped as widget object by using dojo.byNode(node), and then destroyRecursive(true);
基本上，选择节点...您可以通过使用将映射为小部件对象dojo.byNode(node)，然后destroyRecursive(true);
回答by Hil Zapf
I solved a similar problem, simply deleting from registry using dijit.registry.remove('idName')after eliminating the content with destroyRecursive(false), before Reloading it.
我解决了一个类似的问题，在使用destroyRecursive(false)删除内容之后，在重新加载它之前使用dijit.registry.remove('idName')从注册表中删除。
if(typeof registry.byId("tableOfContents") != "undefined"){
registry.byId("tableOfContents").destroyRecursive(false);
dijit.registry.remove('tableOfContents');
}
回答by Venkatesan Natarajan
If you have more than one widget to be destroyed on a page, the following solution works for me.
如果您在一个页面上有多个小部件要销毁，以下解决方案对我有用。
var widg = dijit.findWidgets(dojo.byId('root-id')); // root-id is top div id which encloses all widgets
$(widg).each(function(){
dijit.byId($(this).attr("id")).destroy(true);
});
