Ressourcen für JavaScript- und DOM -Kompatibilitätstabellen

Eine der besten Info-Apps in den letzten Jahren ist das bekannte und superpraktische, kann ich von Alexis Deveria verwenden.

Obwohl kann ich für viele hochmoderne Funktionen gut verwenden, gibt es immer noch viele JavaScript- und DOM-Dinge, die dort nicht enthalten sind. Welche anderen Optionen gibt es für die Suche nach Browser -Unterstützung für viele verschiedene JavaScript- und DOM -Funktionen?

Ich recherchiere immer zu verschiedenen Front-End-Technologien, aber das einzige, was ich noch nicht gefunden habe Html5 apis.

Obwohl eine einzige Ressource nicht wirklich existiert (zumindest keine, die ich kenne), gibt es einige Ressourcen, auf die ich zusammen gestoßen bin und die zusammen eine ziemlich gute Übersicht bilden, welche Funktionen unterstützt werden, in denen Browser, und insbesondere alle älteren Versionen von IE, die Sie möglicherweise noch unterstützen müssen.

Key Takeaways

• Obwohl es keine einzige umfassende Ressource für JavaScript und DOM -Kompatibilität gibt, bieten mehrere Ressourcen zusammen einen guten Überblick über die Funktionsunterstützung in verschiedenen Browsern. Dazu gehören ich, kann ich, MDNs Referenz, MairksMode DOM-Referenz von Peter-Paul Koch, Webbrowser-Kompatibilitätstabellen von Cody Lindley, Big JS-Kompatibilitätstable von Tobias Buschor, Dottoro JavaScript Web Referenz, dh Dev Center JavaScript und DOM-Referenz, Ecmascript, Ecmascript Kompatibilitätstabellen von Kangax/Arnott und JavaScript -Kompatibilitätsprüfer von Thijs BUSSER.
• Tatsächliche Tests auf den verschiedenen Geräten und Browsern, die Sie unterstützen müssen, sollten immer die primäre Methode zur Bestimmung der Kompatibilität sein. "Support" -Tabellen enthalten möglicherweise nicht immer relevante Fehler, die möglicherweise eine Funktion unbrauchbar machen, und einige Ressourcen können falsch sein.
Die Referenz von
• MDN ist ein guter Ausgangspunkt, wenn ich nicht über die benötigten Informationen verfügt. Es bietet einen vorläufigen Überblick über die Unterstützung verschiedener JavaScript -Funktionen. Es ist auch von irgendjemandem bearbeitet. Wenn Sie also falsche Informationen finden, können Sie sie aktualisieren.
• Der JavaScript -Kompatibilitätsprüfer von Thijs Busser ist ein neues Tool, mit dem Sie JavaScript -Code einfügen oder hochladen können, um eine Analyse der Kompatibilität des Codes zu erhalten. Es verwendet Informationen aus den Kangax -Tabellen und kann ich verwenden, wobei ich mich auf neuere APIs und Funktionen konzentriere, die in ES5 und später hinzugefügt wurden. Es ist jedoch immer noch neu und liefert möglicherweise nicht immer genaue Ergebnisse.

Natürlich übertrumpft tatsächliche Tests alle

Bevor Sie in die Ressourcen eingehen, ist es selbstverständlich, dass die tatsächlichen Tests auf den verschiedenen Geräten und Browsern, die Sie unterstützen müssen, immer die Hauptmethode sein sollte, um die Unterstützung zu bestimmen.

Es ist schön, einen zweiten Überblick über die Unterstützung zu erhalten. "Support" -Tabellen enthalten jedoch nicht immer relevante Fehler, die die fragliche Funktion möglicherweise unbrauchbar machen. Und das ist außer der Tatsache, dass einige Ressourcen einfach einfach falsch sein können.

Stellen Sie also sicher, dass Sie die in diesem Artikel beschriebenen Referenzen als Leitfäden durchführen und nicht als endgültiges Wort darüber, ob etwas in einem bestimmten Browser auf einer bestimmten Plattform auf einem bestimmten Gerät funktioniert

MDNs Referenz

Wenn Sie etwas auf

nicht finden, können Sie verwenden, ist der erste Ort, an dem Sie nachsehen sollten, das Entwicklernetzwerk von Mozilla. Und ich bin sicher, dass die meisten von Ihnen genau das tun. In den meisten Fällen benötigen Sie alles, was Sie benötigen, um einen guten vorläufigen Überblick über die Unterstützung für eine bestimmte JavaScript -Funktion zu erhalten, die Sie für nicht finden können, verwenden.

Nehmen wir beispielsweise an, Sie möchten addEventListener () und removentListener () nachschlagen. Sie werden diese auf

nicht finden, kann ich verwenden? Aber Sie können beide mit Browser -Informationen auf mdn. finden

Wie Sie im obigen Bildschirmgrab sehen können, gibt es zusätzlich zu den Details, in denen die Browser „grundlegende Unterstützung“ haben, in diesem Diagramm häufig zusätzliche Informationen zu Funktionen, die in späteren Versionen von ECMascript hinzugefügt wurden.

Denken Sie auch daran, dass die Referenz von MDN von irgendjemandem bearbeitet werden kann. Wenn Sie also feststellen, dass etwas falsch ist, können Sie es nicht aktualisieren.

QuirksMode DOM-Referenz von Peter-Paul Koch

Welche Diskussion über Browser-Kompatibilitätstabellen wäre nicht vollständig, ohne Peter-Paul Koch und seine hervorragenden Referenztabellen zu erwähnen, die alle auf seinen eigenen Tests basieren.

Kochs Tabellen enthalten Support -Informationen für Desktop- und Mobile -Browser, und es sieht für mich so aus

Webbrowser -Kompatibilitätstabellen von Cody Lindley

Hier ist eine, die nicht zu bekannt zu sein scheint und von Cody Lindley gebaut wurde, die einige großartige Bücher über JavaScript und The DOM geschrieben hat. Es heißt Webbrowser -Kompatibilitätstabellen (WBCT) und eine Mammutressource.

Cody's Website enthält Support -Tabellen, die auf IE6 zurückkehren und Folgendes enthalten:

DOM -Unterstützung für Desktop- und Tablet/Telefon -Browser

• DOM -Ereignisse Support für Desktop- und Tablet-/Telefonbrowser
• ES6 Support für Desktop- und Tablet/Telefon -Browser
Dies sind die Hauptbereiche für Entwickler, die JavaScript -Unterstützungsinformationen erforschen. WBCT enthält jedoch auch Support -Tabellen für CSS, BOM, SVG und vieles mehr. Achten Sie also darauf, dass Sie das mit einem Lesezeichen versehen. Es dient als schöne gründliche Ergänzung zu Mdn.

Big JS-Kompatibilitätstable von Tobias Buschor

Dieser ist definitiv nicht sehr bekannt, aber es könnte etwas haben, das nicht in Cody Lindleys Tabellen enthalten ist oder etwas, das auf MDN nicht gut dokumentiert ist.

Es ist ein großer JS-Kompatibilitätstable, der von Tobias Buschor erstellt wurde.

Auch dies ist eine riesige Ressource und ich mag es wirklich, wie Sie in eine bestimmte JavaScript- oder DOM -Funktion einblecken können. Wenn Sie beispielsweise durch die Ausgangsliste (die mit dem Fensterobjekt startet) scrollen können, können Sie auf so etwas wie StorageEvent klicken, und es gibt Ihnen eine Liste von Methoden und Eigenschaften auf diesem bestimmten Objekt.

Obwohl dies eine wirklich umfassende Ressource ist, habe ich festgestellt .

Ich benutze diese im Allgemeinen als dritte oder vierte Möglichkeit, wenn ich mir eine bestimmte Funktion betrachte, die an anderer Stelle nicht zu gut dokumentiert ist.

Dottoro JavaScript Web Reference

Die von Dottoro, einem IT -Dienstleistungsunternehmen, verwaltete Dottoro JavaScript -Referenz ist eine ziemlich anständige Ressource für viele verschiedene JavaScript- und DOM -Funktionen.

In Fällen, in denen die Browserunterstützung voll ist, sehen Sie in allen Versionen ein Browser-Symbol, das dies anzeigt, oder ein ausgewaschenes Symbol, das auf mangelnde Unterstützung hinweist. Wenn die Unterstützung bei einer bestimmten Version beginnt, wird dies auch angegeben. Sie können dies im Screenshot unten sehen:

Zusätzlich zur Browserunterstützung enthält diese eine kurze Beschreibung der Funktion, die Sie nach oben suchen. Das ist also ein bisschen Bonus.

Was ich an dieser Ressource wirklich mag, ist die schöne Suchfunktion, die beim ersten Besuch der Website nicht sehr offensichtlich ist. Es wird in einem Lightbox -Fenster ausgelöst, indem Sie auf eine der beiden Schaltflächen "By -Namen" klicken. Die Seitwärtsschaltfläche ist im folgenden Screenshot angezeigt:

Sie können auch direkt auf der Hauptseite suchen, aber ich mag die Suche in der Lightbox, da sie die Ergebnisse sofort basierend auf dem, was Sie eingeben, filtert, anstatt zuerst eine Ergebnisseite anzuzeigen.

Insgesamt ist die Dottoro -Referenz eine schöne, attraktive Ressource, die auch Browser -Support -Informationen für HTML- und CSS -Funktionen enthält.

IE Dev Center JavaScript und DOM -Referenz

Normalerweise, wenn wir uns über den Browserunterstützung wundern, möchten wir Informationen zu älteren Versionen von IE (jetzt einschließlich IE9 und IE10, die beide nach heutigen Standards als „alt“ gelten).

Das Internet Explorer Dev Center von Microsoft verfügt über eine Bootsladung guter Seiten mit detaillierten Support -Informationen zu JavaScript und DOM -Funktionen.

Sie können beispielsweise die Seite mit der JavaScript-Versionsinformation besuchen, auf der eine Reihe von Funktionen in einer Tabelle mit Unterstützungsinformationen für IE6-11 aufgeführt ist. Sie können auch jede Funktion durchbohren und schließlich zu einer Seite kommen, die einer einzelnen Funktion gewidmet ist.

Wenn Sie also auf die Seite der Foreach -Methode für das Kartenobjekt bohren, erhalten Sie eine Beschreibung dieser Funktion zusammen mit einem Abschnitt mit dem Namen „Anforderungen“, in dem beschrieben wird, welche Versionen von IE diese Funktion unterstützen.

Das ist nur eine kleine Abtastung dessen, was verfügbar ist, um nachzuschlagen. Es gibt auch die DOM -Referenz, die Webanwendungen Referenz (die viele der HTML5 -APIs abdeckt) sowie die Grafik- und Medienreferenz, die Leinwand, Audio/Video -APIs, SVG und Webgl.

abdeckt.

Der einzige wirkliche Fehler auf diesen Referenzseiten des IE -Entwicklers ist die Tatsache, dass sie nur die Unterstützung für IE -Browser abdecken. Das ist jedoch keine große Sache, da der IE normalerweise der Hauptgrund ist, warum wir nach Informationen zum Browserunterstützung suchen.

ECMascript -Kompatibilitätstabellen von Kangax/Arnott

Wenn Sie nach ECMascript -Funktionen suchen, die seit ES5 hinzugefügt wurden, sind eine der besten Ressourcen die Kompatibilitätstabellen von Juriy „Kangax“ Zaytsev und Leon Arnott.

Die Referenz enthält Tabellen, die Kompatibilitätsinformationen für ES5-, ES6-, ES7- und nicht standardmäßige Funktionen abdecken.

Bonus: JavaScript -Kompatibilitätsprüfer von Thijs Busser

Dies ist ein neues Tool, das von Thijs Busser namens JavaScript Compatibility Checker (JSCC) erstellt wurde, mit dem Sie ein Einfügen einfügen oder JavaScript hochladen und dann eine Analyse des Codes erhalten können.

Das Tool verwendet Informationen aus den Kangax -Tabellen und kann ich

verwenden, daher scheint der Fokus hier auf den neueren APIs und Zügen zu liegen, die in ES5 und später hinzugefügt wurden.

Um Ihnen zu zeigen, wie es funktioniert, habe ich einen Code aus diesem MDN -Artikel über Webarbeiter hinzugefügt. Beachten Sie die gezeigten Ergebnisse:

Hier erhalten Sie eine Aufschlüsselung der in dem Code verwendeten Funktionen mit Kompatibilitätsproblemen (dh weniger als 100% Unterstützung) und die Browser verursachen die Probleme.

Ich werde Sie warnen, dass dieses Tool neu ist und wahrscheinlich einige Verbesserungen verwenden könnte. Wenn ich beispielsweise einen Code einfüge, der die Dataset -Eigenschaft verwendet, teilt JSCC mit, dass der Code keine Kompatibilitätsprobleme hat. Aber MDN sagt, dass es in IE10 oder niedriger nicht unterstützt wird. Dies geschieht, obwohl der Datensatz aufgeführt ist, in dem ich verwenden kann, daher sollten die Ergebnisse korrekt sein.

Obwohl dies kein vollständiges und narrensicheres Werkzeug ist, ist es sicherlich etwas, das es im Auge behält, wenn es sich verbessert.

Abschließend

Wie erwähnt, sollten tatsächliche Tests immer das Hauptinformationsmittel zur Kompatibilität sein. Und ich glaube nicht, dass es überall eine einzige Quelle gibt, die eine vollständige Browser -Kompatibilitätsinformationen für alle JavaScript- und DOM -Funktionen enthält. Aber ich denke, die Ressourcen, die ich in diesem Beitrag aufgeführt habe, können als kollektive Einheit dienen, auf die Sie sich für ziemlich genaue Informationen verlassen können.

Natürlich hat es etwas gegeben, das ich verpasst habe. Wenn Sie also eine andere Quelle kennen, können Sie sie den Kommentaren hinzufügen.

häufig gestellte Fragen (FAQs) zu JavaScript DOM -Kompatibilitätstabellen

Was ist eine JavaScript -DOM -Kompatibilitätstabelle? Es enthält Details zu JavaScript, HTML, CSS und anderen Webstandards. Diese Tabellen sind für Entwickler von entscheidender Bedeutung, da sie ihnen helfen, zu verstehen, welche Funktionen unterstützt werden, und ermöglicht es ihnen, Code zu schreiben, der auf allen Plattformen funktioniert. 🎜> Die Verwendung einer JavaScript -DOM -Kompatibilitätstabelle ist unkompliziert. Die Tabelle ist typischerweise in Zeilen und Spalten unterteilt, wobei jede Zeile eine bestimmte Funktion oder Eigenschaft und jede Spalte einen anderen Browser darstellt. Um herauszufinden, ob eine Funktion von einem bestimmten Browser unterstützt wird, finden Sie einfach die Funktion in der Reihe und folgen Sie sie zur Spalte des gewünschten Browsers. Wenn die Zelle als unterstützt gekennzeichnet ist, bedeutet dies, dass der Browser diese Funktion unterstützt.

Warum sind JavaScript -DOM -Kompatibilitätstabellen wichtig? Schnelle und einfache Möglichkeit, die Kompatibilität verschiedener Web -Technologien über verschiedene Browser hinweg zu überprüfen. Dies ist von entscheidender Bedeutung, da nicht alle Browser alle Funktionen unterstützen, und die Verwendung einer Funktion, die nicht von einem bestimmten Browser unterstützt wird, kann zu Fehlern und einer schlechten Benutzererfahrung führen. Durch die Verwendung einer Kompatibilitätstabelle können Entwickler sicherstellen, dass ihr Code über alle Plattformen hinweg korrekt funktioniert. JavaScript ist eine Programmiersprache, die dieser Spezifikation entspricht. Mit anderen Worten, ECMascript dient als Blaupause, und JavaScript ist eine der Implementierungen dieser Blaupause. Andere Sprachen wie ActionScript folgen auch der ECMascript -Spezifikation.

Wie oft werden JavaScript -DOM -Kompatibilitätstabellen aktualisiert? Sie werden jedoch in der Regel regelmäßig aktualisiert, um die neuesten Versionen von Webbrowsern und die neuesten Web -Technologien widerzuspiegeln. Es ist wichtig, eine zuverlässige und aktuelle Kompatibilitätstabelle zu verwenden, um genaue Informationen zu gewährleisten. Partielle Unterstützung 'in einer Kompatibilitätstabelle bedeutet, dass der Browser zwar die Funktion erkennt, aber möglicherweise nicht alle Aspekte davon unterstützt oder sie bei bekannten Problemen unterstützt. Es ist ratsam, die Anmerkungen oder Details zu überprüfen, Open-Source-Projekte, was bedeutet, dass jeder zu ihnen beitragen kann. Dies beinhaltet normalerweise das Senden von Daten oder Korrekturen über einen bestimmten Prozess, der häufig GitHub betrifft. Vor dem Beitrag ist es wichtig, sich mit den Beitragsrichtlinien des Projekts vertraut zu machen.

Was ist die Website 'Caniuse'? Unterstützen Sie Tabellen zur Unterstützung von Front-End-Web-Technologien auf Desktop- und mobilen Webbrowsern. Es ist eine wertvolle Ressource für Entwickler, die Kompatibilität verschiedener Web -Technologien zu überprüfen, einschließlich JavaScript, HTML, CSS und mehr. Kompatibilitätstabellen sind eine wertvolle Ressource, es gibt andere Möglichkeiten, die Browserkompatibilität zu überprüfen. Dazu gehört die Verwendung von Online -Tools wie "Kann ich verwenden", die offizielle Dokumentation der Web -Technologie oder die Verwendung der Feature -Erkennung in Ihrem Code, um festzustellen, ob eine Funktion zur Laufzeit unterstützt wird.

Wie kann ich meinen Code sicherstellen, Funktioniert auf allen Browsern?

Stellen Sie sicher, dass Ihr Code in allen Browsern funktioniert Browser und Geräte. Es ist auch wichtig, die neuesten Webstandards und Browser-Updates auf dem Laufenden zu halten.

Das obige ist der detaillierte Inhalt vonRessourcen für JavaScript- und DOM -Kompatibilitätstabellen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!