javascript - JS - クラスにネストされたアイテムを除く querySelectorAll

Question

カルーセルをネストしており、各カルーセルからボタンのみを選択する必要があります (ネストされたカルーセルのボタンは選択しません)。

だから私はそうする逆が必要.closestです..

これが私がしようとしている方法です

const container = document.querySelector('#selector');
document.querySelector('span').innerHTML = container.querySelectorAll(':not(.carrousel-container) .carousel_container__button').length

<div class="carrousel-container" id="selector">
   <button class="carousel_container__button">The only one i want</button>
   
   <div class="carrousel-container">
     <button class="carousel_container__button">other carousel button</button>
   </div>
   <div class="carrousel-container">
     <button class="carousel_container__button">other carousel button</button>
   </div>
</div>

<p>Found items: <span></span></p>

しかし、私は常に 3 を取得し、最初の 1 つだけを選択する必要があります。

なぜ:not()十分ではないのですか？

> buttonそれぞれ内容が大きく異なるので使えませんのでご了承ください