在GrabzIt中使用CSS選擇器

CSS選擇器用於目標元素，隱藏元素並等待元素功能標識一個或多個HTML元素。 CSS選擇器的兩種主要類型是按id或按類別選擇。 如果HTML元素包含id屬性，則它具有id，如下所示。

<span id="myidentifier">Example Text</span>

要選擇它，您可以創建一個CSS選擇器，例如 #myidentifier

如果HTML元素具有類，則它將具有class屬性，如本示例所示。

<div>
<span class="myclass">Example Text One</span>
<span class="myclass">Example Text Two</span>
<span class="myclass">Example Text Three</span>
</div>

要選擇它，您可以創建一個CSS選擇器，例如 .myclass

如果要選擇具有以下類別的特定元素 myclass 您可以在這種情況下使用標準的CSS選擇器 nth-child（2） 選擇器是這樣的： .myclass:nth-child(2) 選擇第二個myclass跨度。 但是，這僅在這種情況下有效，因為父div元素下沒有其他元素。 例如，如果有ap元素，它將更改第n個子索引。

選擇一個沒有唯一ID或類的HTML元素

有時，您需要選擇的HTML元素沒有頁面內唯一的ID或類。 選擇這些HTML元素時，需要使用更複雜的CSS選擇器。

<div class="Header">
   <a href="https://www.example.com/">
     <div>...</div>
   </a>
   <div class="SearchBar">...</div>
   <div class="TagLine">...</div>
</div>

例如，在上面的示例中，我們要在鏈接中選擇DIV元素。 為此，我們需要指定一個CSS選擇器，該選擇器從唯一的DIV向下使用 Header 類。

div.Header a div

CSS選擇器是Web開發的標準功能。 本文很好地概述了 如何使用CSS選擇器.

處理多個匹配元素

如果從CSS選擇器返回了多個HTML元素，並且您正在使用target元素或等待元素功能，則僅使用第一個匹配元素。 但是，如果您使用hide元素功能，則所有匹配的HTML元素都將被隱藏。

如果要隱藏具有不同ID或類的多個元素，可以通過用逗號分隔每個CSS選擇器來實現。 因此，例如，要隱藏上面的示例類和ID，可以使用以下代碼 #myidentifier,.myclass