Maison > interface Web > js tutoriel > le corps du texte

Comment faire la différence entre la vue Web iPad/iPhone et Safari natif à l'aide de JavaScript ?

Barbara Streisand
Libérer: 2024-10-20 16:43:29
original
215 Les gens l'ont consulté

How to Differentiate Between iPad/iPhone Webview and Native Safari Using JavaScript?

Détection de la vue Web sur iPad/iPhone via JavaScript : une solution complète

Différenciation entre un site Web exécuté dans Safari sur un iPad et dans la vue Web d'une application peut être crucial pour optimiser les fonctionnalités du site Web et l’expérience utilisateur. JavaScript fournit un moyen efficace d'y parvenir.

Explorons une solution JavaScript qui combine deux propriétés clés :

  • window.navigator.userAgent : Contient des informations sur le navigateur et le système d'exploitation de l'utilisateur.
  • window.navigator.standalone : Indique si l'application Web s'exécute en mode autonome.

En utilisant ces propriétés, nous peut créer une instruction conditionnelle qui distingue quatre scénarios :

  1. Safari (navigateur) : standalone === false et safari === true
  2. Autonome (Plein écran) : autonome === vrai et safari === faux
  3. UIWebView : autonome === faux et safari === faux
  4. Pas iOS : Aucune correspondance pour ios dans la chaîne de l'agent utilisateur

Vous trouverez ci-dessous un extrait de code illustrant cette solution :

<code class="javascript">var standalone = window.navigator.standalone,
    userAgent = window.navigator.userAgent.toLowerCase(),
    safari = /safari/.test( userAgent ),
    ios = /iphone|ipod|ipad/.test( userAgent );

if( ios ) {
    if ( !standalone &amp;&amp; safari ) {
        //browser
    } else if ( standalone &amp;&amp; !safari ) {
        //standalone
    } else if ( !standalone &amp;&amp; !safari ) {
        //uiwebview
    };
} else {
    //not iOS
};</code>
Copier après la connexion

En exploitant ce JavaScript code, les développeurs peuvent détecter efficacement l'environnement dans lequel leur site Web s'exécute sur les appareils iOS, ce qui leur permet d'adapter les fonctionnalités du site Web et d'améliorer l'expérience utilisateur en conséquence.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!