jQuery каждая итерационная задача

Question

<section class="photos">
    <table>
        <tr>
            <td><a href="/a"><img src="b.jpg" /></a></td>
            <td><a href="/a"><img src="b.jpg" /></a></td>
            <td><a href="/a"><img src="b.jpg" /></a></td>
        </tr>
        <tr>
            <td><a href="/a"><img src="b.jpg" /></a></td>
            <td><a href="/a"><img src="b.jpg" /></a></td>
        </tr>
    </table>
</section>

А потом я пытаюсь перебрать каждую из них, чтобы вернуть ссылку href и изображение src.

$(".photos td").each(function (index, value) {
    console.log(value.a.attr('href'));
    console.log(value.img.attr('src'));
});

Вышеупомянутый псевдо-сломанный код, к сожалению, не работает. Есть идеи?

Answer 1

Вы не можете запускать методы jQuery на value, так как это просто узел DOM.Сначала создайте из него объект jQuery (я предпочитаю this аргументу value, но в этом случае они одинаковые):

$('.photos td').each(function(){
    console.log( $(this).find('a').attr('href') );
    console.log( $(this).find('img').attr('src') );
});

Answer 2

Попробуйте это:

$(".photos td").each(function (index, value) {
    console.log($(this).find('a').attr('href'));
    console.log($(this).find('img').attr('src'));
});

Answer 3

Адам уже дал ответ, но так как я печатал его ... попробуйте это: (единственное отличие - в части прохождения, поскольку Адам использует «это», а я использую «значение» (которые совпадают).

$(".photos td").each(function (index, value) {
    console.log($('a', value).attr('href'));
    console.log($('img', value).attr('src'));
});

Не забывайте, что значение представляет элемент dom (а не элемент jQuery), а attr () - это метод jQuery, который работает только для объектов jQuery. Также не следует закрыватьваши теги?