Dieser Artikel wurde maschinell übersetzt.

HTML5

Browser- und Funktionserkennung

Sascha p. Corti

 

Wenn Sie eine Website erstellen, soll sie nicht nur heute, sondern noch lange gut aussehen. Das bedeutet, dass die Website nicht nur in den aktuellen Browsern, sondern auch in zukünftigen Versionen funktionieren muss. In diesem Artikel präsentiere ich einige Tipps und best Practices, die Ihnen helfen, dieses Ziel erreichen.

Ein kurzer Rückblick

Heute werden von allen Webbrowsern mit einem gemeinsamen Ziel erstellt: Webseiten optimal die neuesten Spezifikationen zu rendern.

Dies war nicht immer der Fall. In der Vergangenheit als Browser Kreditoren Raste zu beherrschende Stellung, implementiert am meisten der Features, die in der hohen Nachfrage waren, auch wenn sie noch nicht standardisiert wurden nicht. Natürlich hat jeder Browser es auf seine eigene Weise. Hier ist ein Beispiel für wie in CSS Transparenz festlegen vielfältig.

Internet Explorer vor Version 8 die folgenden CSS verstanden:

.transparent {      /* Internet Explorer < 9 */
    width: 100%;
    filter:alpha(opacity=50);
}

während Firefox eigenen Attribut hatte:

.transparent {
    /* Firefox < 0.9 */
    -moz-opacity:0.5;
}

wie Safari:

.transparent {
    /* Safari < 2 */
    -khtml-opacity: 0.5;
}

Jetzt, jedoch in CSS3, gibt es eine einheitliche Möglichkeit zum Festlegen der Transparenz ein Element:

.transparent {
    /* IE >= 9, Firefox >= 0.9, Safari >= 2, Chrome, Opera >= 9 */
    opacity: 0.5;
}

Während es gut für einen Browser, um zur Unterstützung von nicht standardmäßigen Features Stücken erscheinen mag, erschwert das Leben der Web-Entwickler als nötig, weil er hat alle verschiedenen Implementierungen der Funktion berücksichtigt werden beim Hinzufügen zu einer Seite.

Konsistente Markup

Der beste Weg, um sicherzustellen, dass Ihre Webseite in allen Browsern optimal dargestellt wird, ist Markup konzentrieren, die bestimmte in allen aktuellen Versionen der Browser unterstützt wird.Bis vor kurzem war dies HTML 4.01, ein 10 Jahre alten Standard mit sehr begrenzten Features.

Heute sind alle Browser in Richtung der HTML5 funktionsreiche konvergieren – aber viele der neuen Spezifikationen unter diesem allgemeiner Begriff, einschließlich HTML5 Markup, seine APIs wie z. B. DOM Level 2 und 3, CSS3, SVG und EcmaScript 262, zusammengefasst sind, noch in der Entwicklung und somit Änderungen unterliegen.Die Browser-Anbieter sind fortlaufend Unterstützung für neue Features von HTML5, aber ganz andere Schritte hinzufügen.

Firefox und Opera sind in der Regel sehr schnell neue HTML5-Spezifikationen zu verabschieden, manchmal sogar diejenigen in der frühen Entwicklung und zu ändern oder die Sicherheitsprobleme.Während dies für Entwickler, um neue Features interessant sein kann, kann es zu Webseiten führen, die zwischen verschiedenen Versionen der Browser wegen der drastische Veränderungen zwischen einer Spezifikation und ihrer Umsetzung zu brechen.Das ist eine frustrierende Erfahrung für Benutzer und Entwickler.Ein Beispiel hierfür war Firefox 4 deaktivieren Websockets zwischen Beta 7 und 8 Sicherheitsgründen.

Chrom, die auch sehr schnell neue HTML5-Standards zu erlassen, gerührt vor kurzem die Gemeinschaft HTML5 mit der Ankündigung , dass es wurde Unterstützung für gängige h. 264-video-Codec für HTML5 <video> Aufzugeben Elemente Und Stattdessen Die Gebührenfreie WEBM Standard Umschalten.Obwohl Stirbt Darm Für Entwickler, Die momentan Für h. 264-Lizenzen Zu Bezahlen Sein, Fügt es Eine Andere Wahl, die Entwickler Zu Verfolgen, um so Vielen Browsern Wie Möglich Zu Unterstützen.

Microsoft ist Langsamer, Standards Zu Implementieren, Aber es Aber Arbeitet Eng Mit Den W3C Zum Erstellen von Testreihen Help, Mehrdeutigkeiten in Den Spezifikationen Zu Minimieren Und Eine Technische Grundlage Auf die Möglichkeit, Ihren Browser HTML5 Show, Homogenisieren Arbeiten Hersteller Dabei Zu Unterstützen.Die Aktuelle Arbeit in Diesem Bereich Zu Sehen, Schauen Sie Sich Die Internet Explorer 10 Plattform Vorschau Finden Click the IE Test Drive.Möchten Sie Auch Sehen Sie Sich Die HTML5labs, wo Microsoft Prototypen Frühe unstable Spezifikationen von Webstandards Einrichtungen, Wie Z. B. Das W3C.Finden Sie Im Abschnitt "Improved Interoperability Durch Unterstützung von Standards," von InternetExplorer 9 Handbuch für Entwickler Für Detaillierte Information Zu Internet Explorer 9 Wie Die Verschiedenen HTML5 Spezifikationen Heute Unterstützt.

Always ist da die Neuen Standards der HTML5 Ein Bewegliches Ziel Bleiben, Und Die Meisten Internet-Benutzer Nicht Die Neuesten Versionen von Verschiedenen Webbrowsern Verwenden, Das Richtige Markup Serving Wichtiger als Je Zuvor.

Browsererkennung

Ein Ansatz Für Die Behandlung der Unterschiede Zwischen den Browsern ist Browsererkennung Zu Verwenden.Die Gängigste Methode Hierfür ist Mit JavaScript-Benutzer-Agent-Header Abfragen:

<script type="text/javascript">
  if ( navigator.userAgent.indexOf("MSIE")>0 )
  {
    // Run custom code for Internet Explorer.
}
</script>

Das Problem Bei Diesem Ansatz ist Verfolgt. Erstens Bündelt es Mehrere Annahmen Über die Funktionen der Browser in Einem Kontrollkästchen Unterstützt. Eine Individual Falsche Annahme Kann Die Website Unterbrechen. So, als Entwickler Haben Sie Zu Verfolgen Genau Die Funktionen Jedes Einen Bestimmten Browser-Version Unterstützt.

Das Zweite Problem ist, Dass Dieses Kontrollkästchen Browser Nicht Browserversionen Berücksichtigen Und deshalb Keine Zukunft. Auch Wenn es Mit der Heutigen Browser-Version Funktioniert, Die Nächste Version Keine Benötigen – Oder Schlimmer Noch, Remove zeigt Unterstützung Für Mehrwertsteuercodepositionen – Eine Problemumgehung, Die Die Browsererkennung Wurde Verwendet, um Zur Website Hinzufügen.

Deshalb Haben Sie Browser-Erkennung Verwenden, Stellen Sie Sicher, Berücksichtigen Sie Die Version Und Nur Dieser Ansatz Zum Erkennen von Älterer Browser Verwenden, Wie in Gezeigt Abbildung 1.

Abbildung 1 Detect von Veralteten Browsern

<script type="text/javascript">
  functiongetInternetExplorerVersion()
  // Returns the version of Internet Explorer or a -1 for other browsers.
{
    var rv = -1;
    if(navigator.appName == 'Microsoft Internet Explorer')
    {
      var ua = navigator.userAgent;
      varre  = newRegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
      if(re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
    }
    return rv;
  }
  functiononLoad()
  {
    var version = GetInternetExplorerVersion()
    if (version <= 7 && version > -1)
    {
      // Code to run in Internet Explorer 7 or earlier.
}
  }
</script>

The MSDN Library-"Browser Detect Effektiver," Includes for more Information and Finden Sie Einen Umfassenden Artikel Zum Das Navigatorobjekt Und Reguläre Ausdrücke Verwenden, um den Verschiedenen Browsern Und Ihre Genauen Versionen Bei Detect JavaScript Tutorials.

Internet Explorer Hat Ab Version 5, Eine Einzigartige Möglichkeit, den Browser Verwenden Bedingter Kommentare Zu Erkennen. Diese Syntax Erweitert Die Standard-HTML-Kommentare. You can these Bedingte Kommentare Mit Einem CSS, die Guarantee Bestimmte Internet Explorer-Spezifischen CSS-Regeln, die Anderen Browsern Ignoriert Werden Soll. Im Folgenden Beispiel Wird "ie7.css" Geladen, Nur, Wenn Internet Explorer 7 Oder Eine Frühere Version Detect Wird:

<!--[if lte IE 7]>
  <style TYPE="text/css">
    @import url(ie7.css);
  </style>
<![endif]-->

Ausführliche Informationen Zur Verwendung von Bedingte Kommentaren Finden Sie in der MSDN Library-Seite "Über Bedingte Kommentare."

Angesichts der Probleme Und Einschränkungen der Browsererkennung, but Betrachten Eine Alternative.

KE-Erkennung

Ein Weitaus Besserer Ansatz Für Die Verarbeitung der Unterschiede Zwischen Den Web-Browsern ist Die Verwendung der KE-Erkennung. Bevor Sie Ein Feature, Das Sie Wissen, Hat Unterschiedliche Implementierungen in Den Verschiedenen Browsern Verwenden, Führen Sie Einen Kleinen Test, der Für Die Verfügbarkeit von Einem Bestimmten Objekt, Methode, Eigenschaft Oder Verhalten Aussieht. In Den Meisten Fällen Kann dies Versucht Wird, Erstellen Sie Eine Neue Instanz der Funktion in Frage, Und Wenn Diese Instanziierung Etwas Anderes als Null Zurückgegeben Wird, Weiß des Ausgeführten Browser Dieses Feature. Wenn dies Nicht der Fall ist, Können Sie Sich Für Die Verfügbarkeit Einer Problemumgehung Oder Eine Ältere Proprietäre Implementierung des Features Testen.

Vergleich Zwischen Browser Und KE-Erkennung

Wir Verwenden die Diagrams in Abbildungen 2, 3 and 4 Zu Visualisieren, die Funktionsweise der Beiden Ansätze in Verschiedenen Situationen.

Possible Code Paths Through the Test Site
Abbildung 2 Möglichen Codepfade Durch Die Testsite

Results with Well-Known Browser Configurations
Abbildung 3: Ergebnisse Mit Bekannten Browser-Konfigurationen wiederverwenden

Mit Bekannten Browserkonfigurationen Konfrontiert, Beide Methoden funktioniert nicht, Aber Browsererkennung Hat Feste Davon Ausgegangen, Dass Feature ein Und B-Funktion Vom Browser Unterstützt Werden, Während der KE-Erkennung Für Jedes Feature Einzeln Überprüft.

Unknown Browser Configuration
Abbildung 4: Unbekannter Browser-Konfiguration

Es ist Mit Einem Unbekannten Browserkonfiguration Konfrontiert, die Dinge Interessant Zu Werden. KE-Erkennung Dieser Darm Worten Und Findet Heraus, Dass der Browser Bildpunkte A Feature Aber Fallback-Code Für die Funktion b braucht Browsererkennung, Auf der Anderen Seite aktiv war Einen Pfad Basierend Auf Den Namen des Browsers Oder aktiv war in Den Standardpfad, da Keine der Kombinationen Abgefragten Browser-Version Übereinstimmt. In Jedem Fall Wird Nicht in Diesem Beispiel Wird die Seite korrekt Gerendert Werden, da es Kein Codepfad, der Alle Gültigen Code-Segmente Verbindet Gibt, Obwohl Die Seite Tatsächlich Alle replaces Code, um Diese Unbekannter Browserkonfiguration korrekt Anzeigen Enthält.

Beispiele Für KE-Erkennung

Es Gibt Zwei Sehr Wichtige Empfehlungen Im Auge Zu Behalten, Wenn Sie KE-Erkennung Verwenden:

  • Standards Immer Testen da Browser Häufig Neuerer Standard als Auch Die Älteren Problemumgehung Unterstützen.
  • Features für Ziel Nur Bezieht Sich Immer in Eine Prüfung, Effektiv Minimieren Annahmen der Browserfunktionen.

Jetzt Sehen Wir Uns Einige Beispiele Für Die KE-Erkennung.

Das Folgende Skript Erstellt Zwei Codepfade. Zunächst Überprüft, Ob der Browser window.addEventListener Unterstützt Und falls Nicht, Prüfpunkte Für Die Verfügbarkeit der Legacy-window.attachEvent-Funktion:

<script type="text/javascript">
  if(window.addEventListener) {
    // Browser supports "addEventListener"
    window.addEventListener("load", myFunction, false);
  } else if(window.attachEvent) {
    // Browser supports "attachEvent"
    window.attachEvent("onload", myFunction);
  }
</script>

Ein Weiterer Guter Ansatz ist Zum Kapseln von KE-Erkennung in Einen Satz von Funktionen, die Dann Im Code Verwendet Werden Können. Hier ist Eine Bewährte Methode, um Festzustellen, Ob der Browser die HTML5 Unterstützt <canvas> Element-Und in Diesem Fall Stellt Sicher, Dass die canvas.getContext('2d')-Methode als Auch Funktioniert. Diese Funktion Gibt Einfach True Oder False Und Wiederverwendung Zu Erleichtern.

<script type="text/javascript">
  functionisCanvasSupported()
  {
    var elem = document.createElement('canvas'); 
    return!!(elem.getContext && elem.getContext('2d');
  }
</script>

Eine Sache Im Auge Zu Behalten, Wird Mit der KE-Erkennung Mit Immer es Neu Erstellt Elemente Oder Objekte, so dass Sie die Möglichkeit, Dass Andere Skripts Auf der Seite Das Element Oder Objekt Geändert Hat, Seit es Erstellt Wurde, die Zufällige Oder Ungleichmäßig Ergebnissen Führen Könnte.

KE-Erkennung Funktioniert Auch Restarted Direkt HTML-Elemente, Z. B. HTML5, <video>, <audio> Und <canvas> in Form von "Fallback". Der Browser Zeigt Das Supported Erste Unterelement von above and Visuell wird Sie sichtbar gemacht Die Folgenden Elemente.

Die Einfachste Form Sieht folgendermassen aus:

<video src="video.mp4">
    Your browser doesn't support videos natively.
</video>

Einen Browser, der <video> Unterstützt. Element Wird Das Video "video.mp4" Show, Während Ein Browser, der Nicht Auf Den Angegebenen Text Zurückgegriffen Wird. Fallback Funktioniert Aber Auch Für Verschiedene Videoformate Im Video-Tag:

<video>
    <source src="video.mp4" type="video/mp4" />
    <source src="video.webm" type="video/webm" />
    Your browser doen't suppport videos natively.
</video>

In Diesem Fall Ein Browser Unterstützt HTML5 <video> Zunächst Versucht Das mp4-Video Zu laden. Wenn Sie Dieses Format Nicht Unterstützt, Wird es Auf Das Webm-Codierte Video Zurückgreifen. Sollte Dieses Format Nicht Unterstützt Werden Oder Sollte Wird der Browser Nicht Unterstützt <video> Überhaupt, Wird es Auf Den Text Zurück.

Ist Natürlich Sinnvoller, ein Plug-in-Video-Player Anstelle von Text, Zurückgreifen, Für Den Fall, Dass der Browser Keine HTML5 Unterstützt <video> Bei Allen. Im folgenden Beispiel Wird Ein Silverlight-Videoplayer Verwendet:

<video>
    <source src="video.mp4" type='video/mp4' />
    <source src="video.webm" type='video/webm' />
    <object type="application/x-silverlight-2">
        <param name="source" value="http://url/player.xap">
        <param name="initParams" value="m=http://url/video.mp4">
    </object>
    Download the video <a href="video.mp4">here</a>.
</video>

Eine Ähnliche Logik Funktioniert Gut in CSS. Nicht Erkannte Eigenschaften Werden in CSS Einfach Ignoriert. Auch Wenn Sie Mehrere Experimentelle, Hersteller-Präfix Eigenschaften Hinzufügen, Wie Mit "Border-Radius" unten Gezeigt Möchten, Können Sie Einfach Alle Variationen in Den Code Einfügen. Dies zeigt Ein Wenig Ungenau Fühlen, Aber es ist Einfach Zu Bedienen Und Erhält die Arbeit Erledigt Für Fälle Wie Diese. Beachten Sie, Dass es Eine Bewährte Methode, die letzten Anbieterspezifische Präfixe Setzen Sie Zuerst Aufnehmen Möchten Und Die Standard-Markup.

<style type="text/css">
    .target
    {
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
    }
</style>

Ein großer Vorteil, KE-Erkennung ist es Funktioniert Auch Mit Browsern Waren Nicht Sogar Denken Sie Beim Erstellen der Seite, Und Auch Mit Zukünftigen Versionen von Browsern da es Keine Annahmen Über Welche Funktionen Hängen Kein Browser Unterstützt.

Entwickeln Und Testen Die KE-Erkennung

Die F12 Developer Tools in Internet Explorer 9 Sind Hervorragend Geeignet Zum Entwickeln Und Testen von Vielen Browsern KE-Erkennung. Können Sie Zum Debuggen von Skript Schritt Für Schritt Und der Browser den Benutzeragententext, als Auch um als Zu Sagen, Internet Explorer wird Die Rendering-Engine der Vorherigen Versionen Ändern**.**Abbildungen 5, 6, 7 Und 8 Show Some Beispiele Für Die Verwendung Dieser Tools.

Using Breakpoints while Debugging JavaScript in Internet Explorer 9
Abbildung 5 Verwenden von Haltepunkten Beim Debuggen von JavaScript in InternetExplorer 9

Running in “Document Mode: IE9 standards,” the bBrowser Uses the Modern addEventListener Method
Abbildung 6 Unter "Dokumentmodus: IE9-Standards" bBrowser Verwendet moderne AddEventListener-Methode

Running in “Document Mode: IE7 standards,” the Debugger Falls Back to the Legacy attachEvent Method
Abbildung 7 Unter "Dokumentmodus: IE7-Standards" Debugger Fällt Zurück Auf Die Legacy-AttachEvent-Methode

You Can Change the Internet Explorer User Agent String on the Fly and Even Add Your Own Strings, Including Those for Mobile Browsers
Abbildung 8 können Sie den InternetExplorer-Benutzer-Agent ändern String on the Fly und sogar eigene Zeichenfolgen, einschließlich derer für Mobile Browser

Verwalten von KE-Erkennung in großen Projekten

Beim Erstellen eines komplexen Projekts können erstellen und Verwalten von alle KE-Erkennung Code mühsam sein. Glücklicherweise gibt es große JavaScript-Bibliotheken zur Verfügung, mit denen in dieser Anstrengung, nämlich Modernizr und jQuery.

Modernizr verfügt über integrierte Erkennung für die meisten HTML5 und CSS3-Funktionen, die sehr einfach in Ihrem Code zu verwenden ist. Es hat sehr weit angenommen und ständig verbessert. Modernizr und jQuery werden mit ASP geliefert.NET MVC-Tools.

Schauen Sie sich den Code in in Abbildung 9, die erkennt, dass die Browserfunktion Webschriftarten anzeigen, ohne Verwendung von Modernizr und dann auf den Code in Abbildung 10 dem Modernizr verwendet.

Abbildung 9 ohne Modernizr

function(){
  var
    sheet, bool,
    head = docHead || docElement,
    style = document.createElement("style"),
    impl = document.implementation || { hasFeature: function()
      { return false; } };
    style.type = 'text/css';
    head.insertBefore(style, head.firstChild);
    sheet = style.sheet || style.styleSheet;
    var supportAtRule = impl.hasFeature('CSS2', '') ?
function(rule) {
        if (!(sheet && rule)) return false;
          var result = false;
          try {
            sheet.insertRule(rule, 0);
            result = (/src/i).test(sheet.cssRules[0].cssText);
            sheet.deleteRule(sheet.cssRules.length - 1);
          } catch(e) { }
          return result;
        } :
        function(rule) {
          if (!(sheet && rule)) return false;
          sheet.cssText = rule;
          return sheet.cssText.length !== 0 &&
            (/src/i).test(sheet.cssText) &&
            sheet.cssText
              .replace(/\r+|\n+/g, '')
              .indexOf(rule.split(' ')[0]) === 0;
        };
    bool = supportAtRule('@font-face { font-family: "font";
    src: url(data:,); }');
    head.removeChild(style);
    return bool;
  };

Abbildung 10 mit Modernizr

<script type="text/javascript" src"modernizr.custom.89997.js"></script>
<script type="text/javascript">
  if(Modernizr.fontface){
    // font-face is supported
  }
</script>

Hinzufügen von Unterstützung für fehlende Features

KE-Erkennung beseitigen nicht, die Belastung kommen mit eine Problemumgehung, wenn der getestete Browser ein Feature nicht unterstützt, die Sie benötigen. In der früheren HTML5 video Beispiel wurde mithilfe von Silverlight als Fallback eine offensichtliche Lösung. Aber was ist mit anderen HTML5-Funktionen wie <canvas> oder die neue semantische Tags, wie z. B. <nav>, <section> und <article>, <aside>, oder die neue <header> und <footer>?

Eine wachsende Anzahl von gebrauchsfertigen "Decoderfallbacks" für viele Features von HTML5, bekannt als Shims und Polyfills, kann diese Last zu erleichtern. Diese kommen in Form von CSS und JavaScript-Bibliotheken oder manchmal auch als Flash oder Silverlight-Steuerelemente können Sie in Ihrem Projekt hinzufügen fehlende HTML5 Funktionen zu Browsern, die andernfalls diese nicht unterstützen.

Der Grundgedanke besteht darin, dass Entwickler mit HTML5-APIs entwickeln können, und Skripts erstellen können, die Methoden und Objekte, die vorhanden sein sollten. Auf diese Weise für die Zukunft zu entwickeln bedeutet, dass Benutzer aktualisieren, des Codes nicht ändern muss und Benutzer in den systemeigenen optimal sauber verschieben.

Der Unterschied zwischen Shims und Polyfills ist, dass Shims nur ein Feature imitieren, und jede eine eigene proprietäre API, hat während Polyfills die HTML5-Funktion selbst und seine genaue API emulieren. Daher speichert im Allgemeinen mit einem Polyfill Sie den Aufwand, der eine proprietäre API erlassen.

Die HTML5 Cross-Browser Polyfills Github-Auflistung enthält eine ständig wachsende Liste von verfügbaren Shims und Polyfills.

Modernizr, z. B. "HTML5Shim" semantic Tag Support enthält, aber es ist einfach, andere Shims und Polyfills zu laden, wenn die Modernizr erkennt, dass ein Feature nicht unterstützt wird.

Dynamisches Hinzufügen von Unterstützung

Sie können Fragen Sie sich, "Werden nicht alle Skriptbibliotheken hinzufügen machen Meine Seite riesig und langsam zu laden?"

Nun, ist es wahr, die viele unterstützende Bibliotheken mit erheblichen Overhead zu Ihrer Website hinzufügen können, so macht es Sinn, diese dynamisch laden, nur, wenn sie wirklich benötigt werden. Im Falle einer Shim oder Polyfill ist am besten laden sie nur, wenn Sie festgestellt haben, dass der Browser die systemeigene HTML5-Funktion nicht unterstützt.

Erneut wir Glück da gibt es eine große Bibliothek, die genau dieses Szenario unterstützt: yepnope.js

Yepnope ist eine asynchrone Ressourcenladeprogramm, die mit JavaScript und CSS funktioniert und Vorabladen Ausführung vollständig entkoppelt. Dies bedeutet, dass Sie Vollzugriff auf Wenn die Ressource ausgeführt wird und Sie die Reihenfolge on the Fly ändern können. Yepnope Modernizr 2 integriert werden, aber kann auch alleine verwendet werden. Werfen wir einen Blick auf die Syntax:

<script type="text/javascript" src="yepnope.1.0.2-min.js"></script>
<script type="text/javascript">
    yepnope({
        test : Modernizr.geolocation,
        yep  : 'normal.js',
        nope : ['polyfill.js', 'wrapper.js']
    });
</script>

In diesem Beispiel auf der Seite Yepnope testet die Browser-Fähigkeit, HTML5 Geolocation mit Modernizr zu verwenden.Wenn unterstützt, wird Ihre eigenen Code (normal.js) geladen werden; Andernfalls wird eine benutzerdefinierte Polyfill, (die aus polyfill.js und wrapper.js) geladen werden.

Die wichtigsten Punkte zusammengefasst sind, Abbildung 11.

Abbildung 11 Browsererkennung und KE-Erkennung potenziellem

  DO DON'T
Browsererkennung

Versuchen Sie, ganz zu vermeiden.

Oder

Test für einen bestimmten Browser und Version.

Nahmen Sie für künftige Browser durch Tests nur für den Namen des Browsers an.
KE-Erkennung Testen Sie zuerst Standards. Übernehmen Sie nicht verwandter Features unter einem Test.

Resources:

Weitere Informationen über Browser und KE-Erkennung an:

Sascha p. Corti arbeitet Für Microsoft Schweiz als Developer Evangelist Konzentration Auf die Microsoft-System-Plattform Und Developer Tools, Und er Führt the latest Trends in der Schweizer Entwickler-Community.Er Konzentriert Sich momentan Auf Web-Technologien Und die Windows Phone-7-Plattform.

Sein Studium Beteiligten Computer Science an der ETH Zürich Und Informationsmanagement an der Universität Zürich.

Für Sieben Jahre Sascha war Ein Software-Entwickler Und Architekten Einer Bedeutenden Schweizer Bank Und Arbeitete er als Systems Engineer Und Technologie-Spezialist Für Mehrere American Hi-Tech-Unternehmen, EINSCHLIESSLICH Silicon Graphics Und Microsoft.

Read Über Seine Latest Aktivitäten Auf Seinem Weblogs bin http://techpreacher.corti.com and https://blogs.msdn.com/swiss_dpe_team/ Oder Folgen Ihm Auf Twitter @ TechPreacher.

Dank der Folgenden Technischen Experten Für die Überprüfung Dieses Artikels: Garnett von Justin UndThomas Lewis