0

Como fazer para verificar se o navegador suporta HTML 5?

Por exemplo, gostaria de definir um campo do formulário como requerido. Posso utilizar o parâmetro required:

<input type="text" required>

Mas vi que required funciona apenas a partir do HTML 5. Se o navegador do cliente não suportar esta versão, o campo pode não funcionar como desejado.

Assim, existe alguma maneira de eu verificar se o cliente atual suporta HTML 5 para que quando não suportar eu forçar esta validação via JavaScript?

4

2 Respostas 2

2

HTML5 não é exatamente um recurso que você pode verificar ou não se está presente. HTML5 foi o nome dado a uma série métodos, componentes e tags adicionados a linguagem HTML que foram recebendo suporte gradativamente pelos browsers.

Algo que acho importante mencionar é que todos os principais browsers aceitam as features HTML5 e já o fazem a bastante tempo então não entendi muito bem o motivo de você querer fazer essa verificação em vez de simplesmente assumir que o browser tem a validação e pronto. Deixe os browsers antigos morrerem.

Outro tópico digno de ser mencionado é: Não se deve confiar em nenhuma validação apenas no front-end, são simples de burlar até mesmo pelos inspetores.

Com isso dito, você e sabendo que HTML5 não é algo que da pra verificar se está lá ou não, o que você pode fazer é verificar diretamente o método que precisa.

No caso da validação, você pode selecionar um formulário em sua página document.querySelector('form') acessar o __proto__ (onde ficam todos os métodos nativos daquele elemento e verificar se o método checkValidity (que é o nome do método que faz a validação do HTML) existe ou não.

if (typeof document.querySelector('form').__proto__.checkValidity) === 'function' {
// O formulário tem validação nativa 
} else { 
// O formulário não tem validação nativa
}
0

O bom sempre é olhar na documentação sobre o recurso e o suporte dele pelos navegadores. Aqui está uma lista dos principais recursos do HTML5 e o nível de suporte pelos navegadores: http://html5readiness.com/
Caso você queira adaptar o seu código para uso em navegadores mais antigos é necessário que você crie um script para isso ou utilize uma biblioteca já criada para tratamento de incompatibilidade com navegadores como o Modernizr ou o IE7.js por exemplo. O Modernizr (http://modernizr.com/) é uma pequena biblioteca javascript que

Este link explica bem sobre sua questão: https://medium.com/@eduagni/html5-css3-suporte-dos-navegadores-e-t%C3%A9cnicas-de-compatibilidade-186d6c876434

1
  • 1
    1) Há uma diferença entre saber quais versões suportam o recurso e se a versão do cliente suporta o recurso; 2) Já que cita que a biblioteca Modernizr pode resolver o problema, poderia dar um exemplo concreto de solução especialmente para o atributo required?
    – Woss
    Commented 10/01/2019 às 10:51

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .