从 CSS 选择器中排除 div

Posted 2023-03-06

【中文标题】从 CSS 选择器中排除 div

【英文标题】：Exclude div from css selector

【发布时间】：2019-04-07 04:58:22

【问题描述】：

我试图只选择不在 div 元素内的文本。在这种情况下，我想排除具有bbCodeBlock 类的 div。我怎样才能做到这一点？这个想法是排除引用。

demo

<li id="post-6062713">
  <div class="uix_message ">
    <div class="messageInfo">
      <div class="messageContent">
        <article>
          <blockquote class="messageText SelectQuoteContainer">
            <div class="bbCodeBlock bbCodeQuote">
              <aside>
                <div class="attribution type">user said:
                  <a href="#" class="AttributionLink">↑</a>
                </div>
                <blockquote class="quoteContainer">
                  <div class="quote">text to ignore</div>
                </blockquote>
              </aside>
            </div>
            text to change color
            <br>
            <br>
            <br>
            <br>
            <div class="bbCodeBlock bbCodeQuote">
              <aside>
                <div class="attribution type">user said:
                  <a href="#" class="AttributionLink">↑</a>
                </div>
                <blockquote class="quoteContainer">
                  <div class="quote">text to ignore</div>
                </blockquote>
              </aside>
            </div>
            text to change color
            <div class="messageTextEndMarker">&nbsp;</div>
          </blockquote>
        </article>
      </div>
    </div>
  </div>
</li>

这是一个用 scrappy 复制的基本演示，因为我需要排除引号，所以我正在寻找一个单行选择器来应用于类似的东西

'text': quote.css('article blockquote').extract()

【参考方案1】：

评论后编辑：

我刚刚意识到你想要影响的内容不是在div，而是与div 类.bbCodeBlock 处于同一级别，即直接内容blockquote 元素。

因此您需要使用两个选择器/规则，一个用于设置blockquote 的颜色，另一个用于排除blockquote 中具有.bbCodeBlock 类的div 子元素：

article blockquote 
  color: red;

article blockquote div:not(.bbCodeBlock) 
  color: initial;

<li id="post-6062713">
  <div class="uix_message ">
    <div class="messageInfo">
      <div class="messageContent">
        <article>
          <blockquote class="messageText SelectQuoteContainer">
            <div class="bbCodeBlock bbCodeQuote">
              <aside>
                <div class="attribution type">user said:
                  <a href="#" class="AttributionLink">↑</a>
                </div>
                <blockquote class="quoteContainer">
                  <div class="quote">text to ignore</div>
                </blockquote>
              </aside>
            </div>
            text to change color
            <br>
            <br>
            <br>
            <br>
            <div class="bbCodeBlock bbCodeQuote">
              <aside>
                <div class="attribution type">user said:
                  <a href="#" class="AttributionLink">↑</a>
                </div>
                <blockquote class="quoteContainer">
                  <div class="quote">text to ignore</div>
                </blockquote>
              </aside>
            </div>
            text to change color
            <div class="messageTextEndMarker">&nbsp;</div>
          </blockquote>
        </article>
      </div>
    </div>
  </div>
</li>

【讨论】：

请不要更改我的答案

对不起，但这对我不起作用，因为这是一个在爬行时复制的基本示例。我需要排除初始引号以避免重复文本。

我不知道你所说的“初始引用”是什么意思：你想排除所有包含该类的 DIV 的blockquotes，还是什么？

FWIW：我的 sn-p 完全符合您在问题中的要求。如果这不是您想要的，您需要重新表述您的问题和您提供的代码。

所以你想隐藏“改变颜色的文字”文字？单独使用 CSS 是不可能的。您需要将其包装在 span 标记中，并应用您用作 display: none 选择器的类（或使用 javascript）