选择多个类jquery

Question

我对Jquery和编写包含多个页面的图库非常陌生，我对Jquery选择器有一个问题。

我正在尝试选择一个img标记和一个a标记，这两个标记具有不同的类名，并且都在.portfolio-item类中。

我试过的是

var countImages = $(".portfolio-item a img").length;
    console.log(countImages);
    var perPage = 8;
    $('.image, .edit-post-link').css('display', 'none');
    //$('.post-edit-link').css('display', 'none');
    //$('.slider').children().slice(0, perPage).css('display', 'block');
    $('.image, .edit-post-link').slice(0, perPage).fadeIn("fast");
    //$('.post-edit-link').slice(0, perPage).fadeIn("fast");
    function goTo(pageNumb){
        var startFrom = pageNumb * perPage;
        var endOn = startFrom + perPage;
        //$('.post-edit-link').fadeOut("fast").delay( 200 ).slice(startFrom, endOn).fadeIn("fast");
        $('.image, .edit-post-link').fadeOut("fast").delay( 200 ).slice(startFrom, endOn).fadeIn("fast");
    }
    var buttons = countImages/perPage;
    console.log(buttons);
    for (var i = 0; i < buttons; i++) {
        var number = i + 1;
        $(".pagination").append("<li><a class='navigation-number'>"+number+"</a></li>");
        //console.log(number);
    };
    $('.navigation-number').on('click', function() {
        var pageNumber  = $(this).text(); 
        goTo(pageNumber -1);
    });

这只会导致每页有4张图片，但我希望每页有8张图片

    <?php if (have_posts()): while (have_posts()) : the_post(); ?>


    <div class="portfolio-item">
        <!-- post thumbnail -->
        <?php if ( has_post_thumbnail()) : // Check if thumbnail exists ?>
            <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                <?php the_post_thumbnail('medium', array('class' => 'img-responsive image')); // Declare pixel size you need inside the array ?>
            </a>
        <?php endif; ?>
        <!-- /post thumbnail -->
        <div class="edit-post-link">
            <?php edit_post_link(); ?>  
        </div>
    </div>

编辑3：

<div class="col-md-3 portfolio-item">
    <!-- post thumbnail -->
                <a href="http://www.q-mediaspot.nl/blog/cinema-4d/cinema-4d-vaas/" title="Cinema 4d Vaas" style="display: none;">
            <img src="http://www.q-mediaspot.nl/blog/wp-content/uploads/2016/03/placeholder1-250x150.jpg" class="img-responsive image wp-post-image" alt="placeholder1">            </a>
            <!-- /post thumbnail -->

    <div class="edit-post-link">
        <a class="post-edit-link" href="http://www.mywebsite.nl/blog/wp-admin/post.php?post=4&amp;action=edit">Edit This</a>    
    </div>      

​

Answer 1

这

$('.portfolio-item').children('a, img')

Answer 2

var $els = $("img.className, a.otherClassName");

Answer 3

这一点：

$(".portfolio-item a img")

将选择位于a元素内部的img元素，这些元素位于具有portfolio-item类的任何元素的内部。

听起来您想要选择本身具有该类的a和img元素。大概是这样的：

$("a.portfolio-item, img.portfolio-item")

或者，描述性地分解它(在本例中不是实际的选择器)：

$("[tag].[class of that tag], [another tag].[class of that tag]")

任何标签，任何类，无论你想怎么定义它。特别要注意，在这个选择器中，标签和类之间没有空格。这是因为有空格就意味着“第二部分作为第一部分的孩子”，而没有空格就意味着“第二部分作为第一部分的修饰语”。

编辑：，或者，也许我误解了。您的意思是说a和img标记本身是portfolio-item类的其他元素的后代吗？在这种情况下，它更像是这样：

$(".portfolio-item a, .portfolio-item img")

也就是说，“任何.portfolio-item元素中的所有a元素，以及任何.portfolio-item元素中的所有img元素”。