взывать детей в Jquery

0

Я создал функцию JS, которая изменяет размеры изображений под .resizer в моем HTML, .resizer тег изображения следующим образом.

<section id="homeSlide" class="shadow">
    <div class="contentHolder">
        <img class='opaque resize' src="http://www.colette.fr/media/push/swa_mmm_001255.jpg" />
    </div>
    <div class="contentHolder">
        <img class="resize" src="http://www.colette.fr/media/push/EGIFT_01234.jpg" />
    </div>
</section>

В моем JS у меня есть следующая структура.

function ebi() {
var homeSlide = document.getElementById('homeSlide');
var myImgNodes = [];
for (var i = 0; i < homeSlide.childNodes.length; i++) {
    var childNode = homeSlide.childNodes[i];
    if (childNode.nodeType == 1 && childNode.tagName.toLowerCase() == "img") {
        myImgNodes.push(childNode);
    }
}

Однако эта функция не изменяет размер?

демонстрация

  • 1
    почему не $('#homeSlide img').each(...) поскольку вы отметили это jquery?
  • 0
    Где находится элемент с идентификатором slideContent ?
Показать ещё 6 комментариев
Теги:

2 ответа

2
Лучший ответ

Вот как я бы выполнил ebi (не нужно jQuery, предполагая IE8+)

function ebi() {
    return document.querySelectorAll('#homeSlide img.resize');
}

(скрипка)

Поделиться
  • 0
    Я с удовольствием добавлю решение для действительно старого IE, если хотите, это не сложно - просто необычно, учитывая долю рынка.
1

ваши узлы img не находятся на первом уровне, вы можете легко попробовать jQuery:

$('#homeSlide img').each(function(){
//do your task
})

или без jQuery попробуйте это:

function ebi() {
    var slideContent = document.getElementById('slideContent');
    var myImgNodes = [];
    for (var i = 0; i < slideContent.childNodes.length; i++) {
        var divNode = slideContent.childNodes[i];
        if (divNode.nodeType == 1 && divNode.tagName.toLowerCase() == "div"){
            for (var j = 0; j < divNode.childNodes.length; j++) {
                var childNode = divNode.childNodes[j];
                if (childNode.nodeType == 1 && childNode.tagName.toLowerCase() == "img") {
                    myImgNodes.push(childNode);
                }
            }
        }
    }
}

это ваш jsfiddle DEMO, проверьте это.

Поделиться
  • 0
    В своем ответе я не вижу преимущества этого решения jQuery над нативным. Кроме того, нативное решение, которое вы предоставили, очень запутано и может быть сделано гораздо проще, даже без QSA.
  • 0
    На более приятном замечании - вам не нужно делать toLowerCase для имен тегов, они всегда в верхнем регистре, m вы можете просто проверить "DIV" и "IMG" .
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню