How can I check if the browser supports HTML 5?

Asked

Viewed 634 times

0

How to check whether the browser supports HTML 5?

For example, I would like to set a form field as required. I can use the parameter required:

<input type="text" required>

But I saw that required works only from HTML 5. If the client browser does not support this version, the field may not work as desired.

So, is there any way I can check if the current client supports HTML 5 so that when it doesn’t support I force this validation via Javascript?

  • https://caniuse.com/#search=required

  • Leai aqui: https://answall.com/questions/30504/tem-comofazer-feature-detection-pra-css e aqui tb https://answall.com/questions/316656/o-que-s%C3%A3o-Feature-queries-no-css-como-se-o-uso-delas-para-que-que-servir

  • to you can try to use the modernizr

  • 1

    Carlos, I didn’t understand why the question took several negatives, so I tried to edit it to clarify the problem better. See if I didn’t end up changing something important from the original question.

2 answers

1

HTML5 is not exactly a feature that you can check whether or not it is present. HTML5 was the name given to a series of methods, components, and tags added to the HTML language that were gradually being supported by browsers.

Something I think it’s important to mention is that all major browsers accept HTML5 Features and have been doing it for a long time so I don’t quite understand why you want to do this check instead of simply assuming that the browser has the validation and ready. Let the old browsers die.

Another topic worth mentioning is: One should not rely on any validation just at the front-end, are simple to circumvent even by inspectors.

With that said, you and knowing that HTML5 is not something you can check whether it is there or not, what you can do is directly check the method you need.

In the case of validation, you can select a form on your page document.querySelector('form') access the __proto__ (where all native methods of that element are located and check whether the method checkValidity (which is the name of the method that validates HTML) exists or not.

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
}

-1

The good thing is always to look at the documentation about the resource and its support by the browsers. Here is a list of the main features of HTML5 and the level of support by browsers: http://html5readiness.com/
If you want to adapt your code for use in older browsers it is necessary that you create a script for it or use a library already created for handling incompatibility with browsers like Modernizr or IE7.js for example. O Modernizr (http://modernizr.com/) is a small javascript library that

This link explains well about your question: https://medium.com/@eduagni/Html5-css3-navigator support-e-t%C3%A9cnicas-de-compatibility-186d6c876434

  • 1
    1. There is a difference between knowing which versions support the feature and whether the client version supports the feature; 2) Since you cite that the Modernizr library can solve the problem, you could give a concrete example of a solution especially for the attribute required?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.