Question

我正在尝试更改一个类，首先使用Mootools发现它是否是特定图像的父对象（客户以前的Web开发人员似乎已经为我提供了它）。我似乎无法找到关于这个主题的很好的文档。

<div class="textwidget">
<img src="share.jpg">
</div>

到目前为止，我已经设法使用“textwidget”找到所有div：

var obs = $$('.textwidget');

现在我需要循环遍历它们并发现哪个托管具有上面列出的src的子节点...

for(var i=0;i<obs.length;i++){
    if(obs[i].childnode.src == 'share.jpg'){ // <-- non mootools syntax
        obs[i].class = 'new class'; // <-- non mootools syntax.
    }
}

我想像这样运行一个循环，但是在mootools中说话当然。有谁熟悉正确的语法？

由于 -J

Answer 1

我认为你想要的是：

for(var i=0;i<obs.length;i++){
    if(obs[i].getChildren()[0].getProperty('src') == 'share.jpg'){ // <-- mootools syntax
        obs[i].setProperty('class','new class'); // <-- mootools syntax.
    }
}

您可以在此处找到更多详细信息：

http://mootools.net/docs/core/Element/Element

Answer 2

你可以通过选择器/父组合来做这样的事情：

document.getElements("div.textwidget img[src=share.jpg]").getParent("div.textwidget");

http://www.jsfiddle.net/MBc37/4/

或者你可以更彻底/更长远......

// css selector, divs array filtered by existance of a child img
results.mixedFilter = document.getElements("div.textwidget").filter(function(el) {
    return el.getElement("img[src=share.jpg]");
});

// checking vs img src properties of all child imgs
results.longwinded = [];
document.getElements("div.textwidget").each(function(el) {
    var imgs = el.getElements("img");
    if (!imgs.length) return;
    if (imgs.some(function(im) {
        return im.get("src") == "share.jpg";
    })) results.longwinded.push(el);
});

Answer 3

你想要做的是过滤这样的元素数组：

$$('.text-widget').filter(function(e) {
    var child_img = e.getFirst('img');
    return $defined(child_img) && child_img.get('src') == 'share.jpg'
});

如果传递给'filter'的函数返回true，则包含该项。

你也可以使用选择器作为提到的其他答案之一。虽然以这种方式使用它们可能会出现性能问题吗？

Answer 4

这就是你要找的东西：

$$('img[src=share.jpg]').getParent().set('class', 'newClass');

使用Mootools获取子元素值

4 个答案: