Verifique se o corpo tem uma classe específica usando JavaScript

Verifique se o corpo tem uma classe específica usando JavaScript
Ao projetar uma página da web ou o site, pode haver a possibilidade de classificar funcionalidades semelhantes contra uma classe dedicada no final do desenvolvedor. Por exemplo, alocando uma página da web específica para o mesmo elemento, mas com uma classe distinta para tornar as coisas relevantes. Em tais situações, verificar se um corpo tem uma classe específica auxilia em acessar várias funcionalidades facilmente e nos processos de atualização também.

Este artigo demonstrará as abordagens para verificar se um corpo tem uma classe específica usando JavaScript.

Como verificar se o corpo tem uma classe específica usando JavaScript?

Para verificar se um corpo tem uma classe específica usando JavaScript, aplique as seguintes abordagens:

  • ““Lista de classe”Propriedade e“contém ()”Método.
  • ““getElementsByTagName ()" e "corresponder()" métodos.
  • ““jQuery”.

Vamos ilustrar cada uma das abordagens uma por uma!

Abordagem 1: Verifique se o corpo tem uma classe específica em JavaScript usando a propriedade ClassList e contém () métodos

O "Lista de classe”Propriedade fornece os nomes da classe CSS de um elemento. Considerando que a "contém ()”O método dá verdadeiro se um nó é um descendente. Esses métodos combinados podem ser aplicados para acessar a classe contida no elemento associado.

Sintaxe

nó.contém (desnode)

Na sintaxe acima:

  • ““desnode”Corresponde ao nó descendente do nó associado.

Exemplo
Vamos ter uma visão geral do exemplo abaixo:


Este é o site Linuxhint



Aplique as etapas abaixo, conforme fornecido no código acima:

  • Em primeiro lugar, inclua um “”Elemento com o atributo definido“aula”.
  • Além disso, adicione um cabeçalho dentro do elemento específico ().
  • No código JS, aplique o “Lista de classe”Propriedade combinada com o“contém ()”Método.
  • Isso irá acessar resultante à classe dos associados “”Elemento baseado no nome da classe especificado no parâmetro do método.
  • Sobre a condição satisfeita, o “se“Condição será executada.
  • Por outro lado, o “outro”O bloco de código de declaração será executado.

Saída

Na saída acima, pode -se observar que a classe em particular está incluída no “" elemento.

Abordagem 2: Verifique se o corpo tem uma classe específica em javascript usando getElementsByTagName () e Match () métodos

O "getElementsByTagName ()”O método fornece uma coleção de todos os elementos com um nome de tag específico. O "corresponder()”O método corresponde ao valor especificado com a string. Esses métodos podem ser utilizados para acessar o elemento necessário por sua tag e verificar a classe específica.

Sintaxe

documento.getElementsByTagName (tag)

Na sintaxe fornecida:

  • ““marcação”Representa o nome da tag do elemento.

Exemplo
O exemplo a seguir demonstra o conceito discutido:




No trecho de código acima:

  • Da mesma forma, inclua um “”Elemento com a classe especificada.
  • Além disso, contenha uma imagem com as dimensões definidas dentro do elemento declarado na etapa anterior.
  • Nas linhas de código JavaScript, acesse o “”Elemento por sua tag usando o“getElementsByTagName ()”Método.
  • O "[0]”Indica que o primeiro elemento correspondente à tag declarado na etapa anterior será buscada.
  • O "nome da classe”Propriedade e a“corresponder()”O método corresponderá à classe declarada em seu parâmetro contra o“" elemento.
  • A declaração anterior no “seA condição será executada após a satisfação de todas as condições nas etapas anteriores.
  • Caso contrário, a última declaração será exibida.

Saída

A saída acima indica que a condição aplicada para uma classe específica é satisfeita.

Abordagem 3: Verifique se o corpo tem uma aula específica em javascript usando jQuery

Essa abordagem pode ser implementada para acessar o elemento necessário diretamente e localizar a classe específica contra ela com a ajuda de seu método simplesmente.

Exemplo
Vamos passar pelo exemplo abaixo:





if ($ ("corpo").hasclass ("contém"))
Alerta ("O elemento corporal tem classe")

outro
alerta ("o elemento corporal não tem classe")

Nas linhas acima do código:

  • Inclua o “jQuery”Biblioteca para utilizar suas funcionalidades.
  • Da mesma forma, inclua o “”Elemento com a classe declarada.
  • Além disso, adicione um “”Elemento dentro do elemento declarado na etapa anterior.
  • No código JS, acesse o “" elemento. Além disso, aplique o “hasclass ()”Método para procurar a classe declarada no elemento buscado.
  • Isso irá alertar resultante a mensagem anterior sobre a condição satisfeita.
  • No outro caso, a última declaração será exibida.

Saída

A saída acima implica que o requisito desejado é alcançado.

Conclusão

O "Lista de classe”Propriedade e“contém ()”Método, o“getElementsByTagName ()" e "corresponder()”Métodos, ou os“jQuery”Pode ser usado para verificar se um corpo tem uma classe específica usando JavaScript. Essas abordagens podem ser utilizadas para procurar a classe específica em um elemento, referindo -se ao elemento correspondente diretamente, por sua tag ou usando o método jQuery. Este blog explicou para verificar se um corpo tem uma aula específica em javascript