Это то, что я до сих пор:

<script>
$(document).ready(function(){
    $(".entry-content img:first").addClass('postimage');
});
</script>

Как видите, для первого изображения .entry-content добавлен мой класс. Круто, это отлично работает. Uncool, это работает не для каждого поста, а только для первого на странице.

Я не уверен, как это исправить. Мне нужно каким-то образом использовать .each или что-то не так с тем, что у меня уже есть?

Благодарность

3
Phill Collins 21 Авг 2010 в 11:29

3 ответа

Лучший ответ

Это связано с тем, что селектор CSS выбирает первый .entry-content img, а не первый img в каждом .entry-content. Речь идет о приоритете оператора.

Вы можете перебирать каждый .entry-content и вручную выбирать img:first в этом узле.

$(document).ready(function(){
    var entries = document.querySelectorAll('.entry-content');
    for (var i = 0; i < entries.length; i++) {
        var firstImage = $(entries[i].querySelectorAll('img:first')[0]);
        firstImage.addClass('postImage');
    }
});
1
Delan Azabani 21 Авг 2010 в 08:22

Это перебирает все ваши сообщения и применяет класс к первому изображению в каждом.

$.each('.entry-content', function() {
    $(this).find('img:first').addClass('postImage');
});
0
Paul Dragoonis 21 Авг 2010 в 08:37

Вариант ответа Пола Драгуниса:

$(".entry-content").each(function ()
{
    $("img:first", this).addClass("postImage");
});
0
cllpse 21 Авг 2010 в 09:07