插入、移动和删除DOM节点

dojo.isDescendant(node,ancestor)如果节点是一个祖先的后代则返回true

例：dojo.isDescendant(dojo.byId("test"),dojo.byId("questions"));    ture

使用dojo.place来移动节点，接受一个源节点、一个参考节点和一个位置信息。

位置信息："before/after": 节点放在参考节点之前或之后，可看做参考节点的兄弟节点。

                    "first/last": 节点作为参考节点的第一个/最后一个子节点放置。

                    n: 该节点作为参考节点的第n个子节点放置，n为0意味着是第一个子节点。

如下示例：  

原始HTML结构：

<form>
<p class="test">问卷调查</p>
<div class="questions" id="questions">
<p title="test" class="test">
<span><input type="radio" name="q1" value="yes">yes</span>
<span><input type="radio" name="q1" value="no">no</span>
Are you a C programmer?
</p>
</div>
</form>

JS代码：

function createNode(tag,className){
var newNode = document.createElement(tag);
dojo.addClass(newNode,className);
return newNode;
}

function restructure(){
var questionGroup = dojo.query("div.questions")[0];
dojo.query("p",questionGroup).forEach(function(node){
var question = createNode("div","question");
dojo.place(question,questionGroup,"last");
dojo.query("span",node).forEach(function(choiceNode){
var choice = createNode("p","choice");
dojo.place(choice,question,"last");
dojo.place(choiceNode,choice,"last");
});
dojo.place(node,question,"last");
});
}

之后的HTML：

<form>

<p class="test formTitle">问卷调查</p>

<div id="questions" class="questions">

<div class="question">

<p class="choice">

<span>

<input type="radio" value="yes" name="q1">

yes

</span>

</p>

<p class="choice">

<span>

<input type="radio" value="no" name="q1">

no

</span>

</p>

<p class="test darkBg" title="test" style="background: none repeat scroll 0% 0% rgb(204, 204, 204);">Are you a C programmer?</p>

</div>

        </div>

</form>