我可以使用括号分隔多个选择器吗？

Posted 2021-04-13

我想选择第一个标签a嵌套在div下的类article article_rubric_top或类article article_top article_right

我尝试：

$('div.article.article_rubric_top a:first,div.article.article_top.article_right a:first')

但得到的标签比预期少得多。我想知道在使用多个选择器时是否应该以某种方式分隔嵌套标签选择器？

像这样：

$('(div.article.article_rubric_top a:first),(div.article.article_top.article_right a:first)')

Upd：最小数据示例。我希望匹配所有三个a标签。

<div class="article article_rubric_top">            
            <a href="http://ua.korrespondent.net/showbiz/music/3899530-duet-potap-i-nastia-zaiavyv-pro-te-scho-yde-zi-stseny" class="article__img-link"></a>           
</div>

<div class="article article_top article_right">

            <a href="http://ua.korrespondent.net/ukraine/3899526-ukraintsi-pochaly-chastishe-yizdyty-v-rosiui" class="article__img-link">
                <noscript><img src="https://kor.ill.in.ua/m/400x253/2072539.jpg"></noscript><img src="/i/blank.gif" data-href="https://kor.ill.in.ua/m/400x253/2072539.jpg" alt="Українці почали частіше їздити в Росію" class="article__img lzl"></a>         
</div>

<div class="article article_rubric_top">          
            <a href="http://ua.korrespondent.net/ukraine/3899521-likari-dozvolyly-prodovzhyty-sud-nad-kokhanivskym" class="article__img-link">
            </a>           
</div>

更新由于某种原因，最小的例子不能像我的实际example那样工作

Image of jquery run in browser

我得到div和a标签而不仅仅是a标签。

答案

我认为你不能。我从未尝试过，但我认为有更好的可能性。

你可以简化选择器

$(".article > a");

你可以join一个阵列

$([
    "div.article.article_rubric_top a:first",
    "div.article.article_top.article_right a:first"
].join(","))

我认为这比使用更长的字符串要容易得多

另一答案

尝试像这样编写选择器：

$('div.article.article_rubric_top,div.article.article_top.article_right').find('a:first')

这是一个工作片段，我想这就是你想要的？

$('div.article.article_rubric_top,div.article.article_top.article_right').find('a:first').css('border','1px solid red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="article article_rubric_top">            
            <a href="http://ua.korrespondent.net/showbiz/music/3899530-duet-potap-i-nastia-zaiavyv-pro-te-scho-yde-zi-stseny" class="article__img-link">a</a>           
</div>

<div class="article article_top article_right">

            <a href="http://ua.korrespondent.net/ukraine/3899526-ukraintsi-pochaly-chastishe-yizdyty-v-rosiui" class="article__img-link">b
                <noscript><img src="https://kor.ill.in.ua/m/400x253/2072539.jpg"></noscript><img src="/i/blank.gif" data-href="https://kor.ill.in.ua/m/400x253/2072539.jpg" alt="Українці почали частіше їздити в Росію" class="article__img lzl"></a>         
</div>

<div class="article article_rubric_top">          
            <a href="http://ua.korrespondent.net/ukraine/3899521-likari-dozvolyly-prodovzhyty-sud-nad-kokhanivskym" class="article__img-link">c
            </a>
</div>

另一答案

我期望匹配所有三个标签。

你的选择器应该是div.article a:first-child - 不要用特定的类过度复杂化它。你有一个完全有效的共享类来定位适当的qazxsw poi元素。

div

$('.article a:first-child').css("background-color","yellow");

以上是关于我可以使用括号分隔多个选择器吗？的主要内容，如果未能解决你的问题，请参考以下文章

iPhone：我可以将类方法用于 UIBarButtonItem 的操作选择器吗？

在这种情况下我应该使用顶点着色器吗？

网站可以阻止您在其页面上使用 CSS 选择器吗？

在 Shell 中使用方括号作为多个分隔符

我可以将样式应用于 CSS 或 Sass 中的所有伪选择器吗？

有 CSS 父选择器吗？