Estoy usando atributos de elementos para identificar una estructura similar a un árbol en el DOM y cada nodo que se ramifica cuida a sus hijos. Lo hace buscando descendientes del nodo en el DOM y verificando el atributo que identifica a otro nodo. Necesita hacer esto ya que los nodos secundarios pueden estar varias capas más profundas en el DOM.

Actualmente estoy haciendo esto con el siguiente JS:

 const directChildNodes = [...nodeElement.querySelectorAll(`[tree-node-name="${this.treeName}"]`)] // filter all results where the current node is the closest parent .filter((el: Element) => el.parentElement?.closest(`[tree-node-name="${this.treeName}"]`) === this.host.nativeElement);

Esto funciona, pero no es muy eficiente ya que toma todos los elementos con el atributo y luego filtra los que no identifican el nodo actual como el padre más cercano. Idealmente, podría lograr esto en el selector CSS.

He probado el siguiente selector, pero parece que no funciona:

 nodeElement.querySelectorAll( `[tree-node-name="${this.treeName}"]:not([tree-node-name="${this.treeName}"] [tree-node-name="${this.treeName}"])` )]

Cualquier sugerencia sería genial, gracias!