2010-06-25 7 views
0

Я пытаюсь изменить класс, сначала обнаружив, является ли это родительским объектом определенного изображения, используя Mootools (клиенты, которые, как представляется, использовали предыдущий веб-разработчик для меня). Кажется, я не могу найти много хорошей документации по этому вопросу.Получить значение дочернего элемента с помощью Mootools

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

До сих пор мне удалось найти все дивы с «textwidget» класса с помощью:

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

Теперь мне нужно цикл через них и узнать, в котором находится дочерний узел с СРК перечисленные выше ...

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

ответ

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

+0

вас рок, спасибо. –

+0

Вы должны, вероятно, использовать addClass/removeClass при управлении свойством класса, а не устанавливать его напрямую. Тогда вам не придется беспокоиться о том, чтобы стереть другие классы, если вы примените стиль позже. – Nathan

1

вы могли бы сделать что-то вроде этого через селектор/родительское комбо:

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

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

или вы можете быть более тщательной/longwinded ...

// 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); 
}); 
0

То, что вы хотите сделать здесь фильтровать массив элементов, как это:

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

Если функция, переданная в 'filter', возвращает true, элемент включается.

Вы также можете использовать селекторы в качестве одного из других упомянутых ответов. Хотя могут быть проблемы с производительностью с их использованием?

0

Это то, что вы ищете:

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

Если я правильно вас понимаю, вы хотите получить только текстовые divs, которые содержат изображение src share.jpg. Если все изображения с помощью src share.jpg содержатся в элементах класса textwidget, которые вы ищете, тогда указанный выше код будет автоматически удалять все экземпляры без share.jpg текстовых разделов textwidget. – csuwldcat

Смежные вопросы