Aparentemente, o código html está com um erro na tag, o correto é <button> porém está escrito <buttom> e por alguma razão, só funciona assim. Ao tentar corrigir o nome da Tag, os botões perdem a formatação e não funciona o evento de "click".
Solucionado
Aparentemente, o código html está com um erro na tag, o correto é <button> porém está escrito <buttom> e por alguma razão, só funciona assim. Ao tentar corrigir o nome da Tag, os botões perdem a formatação e não funciona o evento de "click".
hoje, com a Alura e o Google Gemini
Olá, Leandro!
É importante lembrar que a tag correta é <button> e não <buttom> igual você falou.
Quando você corrige o nome da tag para <button>, é possível que os botões percam a formatação e o evento de "click" pare de funcionar. Isso pode acontecer porque pode haver algum estilo CSS ou algum script JavaScript que esteja sendo aplicado aos botões usando a tag <buttom>, e não <button>.
Para corrigir esse problema, você pode verificar se há algum estilo CSS específico para a tag <buttom> e alterá-lo para <button>. Além disso, verifique se há algum script JavaScript que esteja selecionando os botões usando a tag <buttom> e altere-o para <button> também.
Você pode aperter CTRL + F dentro do arquivo CSS e do JavaScript e pesquisar pela palavra "buttom" com "M".
Outra coisa é verificar se está alterando todas tags <buttom>, tanto a tag de abertura quanto a de fechamento.
Espero ter ajudado a resolver o seu problema! Se tiver mais alguma dúvida, estou à disposição. Bons estudos!
Obrigado por responder Renan. Esta solução, eu já havia tentado e não encontrei nenhuma referência a tag "buttom" no css. Além do mais, não é só a formatação mas tambéma lógica para de funcionar. O JavaScript que estou usando, é somente o que foi apresentado até a aula 2 ou 3. Se resume a selecionar os elementos "button" através de um querySelectorAll que usam a mesma classe e adiciona um addEventListener em cada um.
O que você pode fazer para resolver é adicionar a propriedade type="button"" em todos botões para dizer que é do tipo botão, eu percebi que nenhum tinha, então coloquei em todos e funcionou.
Altera a tag de <buttom> para <button> com "n", e adiciona o type="button"" em todos e pronto. Fazendo isso volta a funcionar, ai você só vai precisa ajustar o layout no CSS como ele agora entende que é um botão, o layout muda mesmo dos "+" e "-", precisa ajustar.
<button type="button" class="controle-ajuste" data-controle="-" data-peca="pernas">-</button>
Realmente. funcionou aqui, apesar disso, continuo sem entender. Inclusive o motivo do html ter aceitado uma tag aparentemente errada.
Pois é, no caso isso aconteceu porque o HTML é bem flexível e tolerante a erros, o que significa que mesmo se você usar uma tag com um nome incorreto, o navegador tentará interpretá-la e exibir o conteúdo da melhor forma possível, em vez de retornar um erro.
No seu caso específico, tendo no projeto o <buttom> em vez de <button>, o navegador tratou a tag como uma tag desconhecida e a interpretou como um elemento em linha, ou seja, como uma tag personalizada, aplicando as regras de estilo padrão e tratando o conteúdo dentro da tag como texto simples.
Embora seu projeto tenha funcionado, é importante seguir as especificações e melhores práticas da linguagem para garantir um código semântica e estruturalmente correto, facilitar a compreensão por parte de outros desenvolvedores e evitar problemas ao trabalhar com frameworks ou bibliotecas.
Eu passei para a equipe para eles estarem corrigindo o projeto do curso. Valeu.