Dans la plupart des cas, les développeurs ne reçoivent pas de choisir le navigateur d'un utilisateur. Pour déterminer si un utilisateur particulier peut travailler avec votre application de CSS3, alors, vous devez d'abord détecter le navigateur de l'utilisateur - et ensuite déterminer si ce navigateur est acceptable.

Création du code requis pour effectuer cette tâche en main est pas impossible, mais il peut être difficile. Des articles comme celui de javascripter.net vous indiquent comment effectuer cette tâche, mais un regard sur le code devraient vous dire que cela est une tâche complexe. (Vous pouvez voir le résultat de ce code d'exemple ici.)

jQuery permet d'effectuer la détection avec une relative facilité. L'exemple suivant montre une méthode pour détecter le nom et la version du navigateur de l'utilisateur. Elle repose sur la dernière 1.X version de jQuery, qui est la version 1.10.1 au moment d'écrire ces lignes. (Vous pouvez trouver le code complet pour cet exemple dans le répertoire Chapitre 06 dossier jQuery de la Code téléchargeable comme BrowserDetect.html).

Information sur le navigateur

Ceci est une page HTML5, donc il commence par la déclaration de HTML, . Cet exemple commence avec une structure de base qui comprend le , ,

Le code commence par la première

Toute personne qui utilise l'application aura automatiquement accès à jQuery tant que le navigateur peut accéder à Internet. (Vous pouvez également télécharger une copie de jQuery pour l'accès local à partir du site jQuery.)

La dernière 1.X version de jQuery ne supporte pas directement la fonction de détection de navigateur. Afin de rendre le travail de fonction avec quoi que ce soit plus récente que jQuery 1.8.3, vous devez également inclure le lien pour la bibliothèque jQuery Migrate comme le montre l'exemple.

La de la page commence par un

tag qui contient l'en-tête de la page. La prochaine étape est de fournir un lieu pour jQuery pour mettre le nom du navigateur.

Dans ce cas, l'exemple utilise une

(paragraphe) balise qui a un id de nom. La première

Il est temps pour afficher le nom à l'écran. Le $ (signe dollar) est un symbole spécial qui fait référence à la bibliothèque jQuery, qui est aussi appelé une Application Programming Interface (API). Le morceau de code qui dit, $ ('p [id = "nom"]'). Html, raconte jQuery pour utiliser le

tag avec un identifiant de nom de tenir certaines HTML. Ceci est une sorte de sélecteur.

Vous avez maintenant une balise spécifique choisi. Le code dit alors jQuery pour créer un texte, un , et puis placez le nom du navigateur au sein de cette période. Toute cette information apparaît dans la

tag après l'exécution du script.

Vient ensuite une seconde

tag. Celui-ci a un attribut id de la version. Le script d'accompagnement commence de la même qu'avant. Le $ ('p [id = "version"]'). Html entrée indique jQuery pour placer du code HTML dans le

tag avec un attribut id de la version. Dans ce cas, jQuery fournit ce dont vous avez besoin en tant que propriété. Tout le code a à faire est de dire jQuery pour placer la valeur entre dans le browser.version

tag pour afficher le numéro de version du navigateur. Lorsque vous exécutez cet exemple, vous voyez une sortie similaire à ceci:

Une bibliothèque ne peut détecter que les navigateurs Il est conçu pour détecter. Par conséquent, jQuery détecte certains navigateurs, mais pas d'autres. Par exemple, vous ne pouvez pas utiliser actuellement pour détecter un navigateur Android, car Android est pas dans la liste des navigateurs pris en charge par jQuery (qui se concentre sur les navigateurs de bureau).

La plupart des méthodes de détection de navigateur se fient sur les chaînes de l'agent utilisateur qui contiennent des informations sur le navigateur. Pour voir la chaîne de l'agent utilisateur pour votre navigateur, vérifier ce qui est mon agent utilisateur ?. Vous pouvez généralement trouver des listes de chaînes de l'agent utilisateur pour les appareils en ligne.