Question

我在Jquery中使用了两个：not选择器，如下所示，当我同时使用这两个时，它不起作用？

//$("section:not('#contact')").css({border:"2px solid red"});
//$("section:not('#clients')").css({border:"2px solid red"});

它只能与一个非选择器一起使用，有人知道为什么吗？

这是html

<!DOCTYPE html>
<html>
<head>
    <title>Green Design</title>
    <link href="style.css" rel="stylesheet" type="text/css">
</head>

<body>

    <header>
        <div class="wrapper">
            <h1 id="logo">Green Design</h1>
            <nav>
            <h2>Main Navigation</h2>
            <ul>
                <li><a href="">Home</a><span>/</span></li>
                <li><a href="">About</a><span>/</span></li>
                <li><a href="">Portfolio</a><span>/</span></li>
                <li><a href="">Clients</a><span>/</span></li>
                <li><a href="">Contact</a><span>/</span></li>
            </ul>
        </nav>
    </div>
</header>

<div id="lead-banner">
    <img src="images/banner.jpg" alt="lead banner">
    <div class="banner-overlay">
        <div class="wrapper">
            <div class="banner-title">We Know Web Design</div>
            <p>With over 15 years experience you can be sure your website is in safe hands</p>
            <a href="">View Our Work</a>
        </div>
    </div>
</div>

<div id="main-content">

    <div class="wrapper">
        <section id="points-of-sale">
            <h2>Points of Sale</h2>
            <ul>
                <li>
                    <img src="images/cs-1.png" alt="web design">
                    <h3>Web Design</h3>
                    <p>quatis alique mos et aut occae cum, veliquaspit quo quam, si idem reprorisqui doluptatur accum si sunt ut officiisto enecab id et aut es et laboribusam endi rerum as minullorent officiatum non cuscium quuntem</p>
                </li>
                <li>
                    <img src="images/cs-2.png" alt="e-commerce">
                    <h3>E-commerce</h3>
                    <p>quatis alique mos et aut occae cum, veliquaspit quo quam, si idem reprorisqui doluptatur accum si sunt ut officiisto enecab id et aut es et laboribusam endi rerum as minullorent officiatum non cuscium quuntem</p>
                </li>
                <li>
                    <img src="images/cs-3.png" alt="seo">
                    <h3>SEO</h3>
                    <p>quatis alique mos et aut occae cum, veliquaspit quo quam, si idem reprorisqui doluptatur accum si sunt ut officiisto enecab id et aut es et laboribusam endi rerum as minullorent officiatum non cuscium quuntem</p>
                </li>
            </ul>
        </section>
        <section id="clients">
            <h2>What Our Clients Say</h2>
            <img src="images/head.png" alt="quote">
            <blockquote>quatis alique mos et aut occae cum, veliquaspit quo quam, si idem reprorisqui doluptatur accum si sunt ut officiisto enecab id et aut es et l</blockquote>
        </section>
        <section id="contact">
            <ul id="contact-methods">
                <li>555 555 5555</li>
                <li>hello@whatever.com</li>
                <li>
                    <span>Leaf Studios</span>
                    <span>Times Square</span>
                    <span>NY</span>
                </li>
            </ul>
            <img src="images/map.png" alt="map">
            <ul id="social-nav">
                <li class="facebook"><a href="">Facebook</a></li>
                <li class="twitter"><a href="">Twitter</a></li>
                <li class="pinterest"><a href="">Pinterest</a></li>
                <li class="linked-in"><a href="">Linked In</a></li>
            </ul>
        </section>
    </div>

</div>
<!-- this is how you use jquery in your html -->
<script src="scripts/jquery-3.3.1.js"></script>
<script src="scripts/scripts.js"></script>
</body>
</html>

有人知道解决方案吗？您可以在Jquery中使用两个：not选择器吗？当我使用两个not选择器时，它不是：not选择其中任何一个？这怎么了？

Answer 1

也许在这行：

$('section').not('#contact').not('#clients').css({border:"2px solid red"});

Answer 2

同时尝试

$('section:not(#contact,#clients)').css({border:"2px solid #000"});

和

$('section').not('#contact,#clients').css({border:"2px solid red"});

jQuery不适用于两个：not选择器吗？

2 个答案: