Dojo查询后代？

Question

我的代码：

var parent = document.createElement('div');
var pen = document.createElement('div');
var dog = document.createElement('div');
dog.className = "dog";
pen.appendChild(dog);
parent.appendChild(pen);
dojo.query("> *", parent).forEach( function(node){
    if(node.className == "dog")alert('bark');
});
dojo.query("> .dog", parent).forEach( function(node){
    alert('bark');
});

我没有警觉“吠叫”。我做错了什么？

Answer 1

问题在于生成的html与选择器不匹配：

<div title="parent">
    <div title="pen">
        <div class="dog">
        </div>
    </div>
</div>

由于> *仅匹配pen，> .dog将不匹配。您可以将这些更改为：

var parent = document.createElement('div');
var pen = document.createElement('div');
var dog = document.createElement('div');
dog.className = "dog";
pen.appendChild(dog);
parent.appendChild(pen);
dojo.query("> * > *", parent).forEach(function (node) {
    if (node.className == "dog") {
        alert('bark');
    }
});
dojo.query("> * > .dog", parent).forEach(function (node) {
    alert('bark');
});

这是一个小提琴：http://jsfiddle.net/pTqmL/

修改

或者只需要在parent内部：

dojo.query("*", parent).forEach(function (node) {
    if (node.className == "dog") {
        alert('bark');
    }
});
dojo.query(".dog", parent).forEach(function (node) {
    alert('bark');
});

根据您的评论，我认为您可能忽略/不知道的核心问题是查询的范围是父级。