Instruções
Passo 16
Se você olhar seu HTML, o primeiro
tab já está selecionado por padrão e tem um atributo aria-selected definido como "true". Quando um usuário clica em uma aba diferente, todas as abas devem primeiro ser definidas como aria-selected="false".
Para isso, você pode usar o método setAttribute para alterar o atributo aria-selected de cada aba.
Aqui está um exemplo de como usar o método setAttribute em uma lista de elementos div:
const divs = document.querySelectorAll("div");
divs.forEach(div => {
div.setAttribute("class", "new-class");
});
Use um forEach na coleção tabs para percorrer cada aba e definir seu atributo aria-selected como "false". Para a função de callback, você pode usar qualquer nome de parâmetro que desejar, mas é melhor não usar tab já que ele já está sendo usado no loop externo forEach.
O que fazer:
Testes:
- Quando o usuário clica em uma aba, todas as abas devem ter seu atributo `aria-selected` definido como `"false"`.
Preview