検索
ホームページウェブフロントエンドjsチュートリアルJavaScriptおよびDOM互換性テーブルのリソース

JavaScriptおよびDOM互換性テーブルのリソース

近年に登場する最高の情報アプリの1つは、Alexis Deveriaが使用できる有名で非常に実用的なことです。

は多くの最先端の機能に最適ですが、そこには含まれていないJavaScriptとDOMのものはまだたくさんあります。では、さまざまなJavaScriptとDOM機能のブラウザサポートを検索するための他のオプションはありますか? 私は常にさまざまなフロントエンドテクノロジーの研究を行っていますが、私がまだ見つけていないことの1つは、JavaScriptとDOMのあらゆる側面のブラウザサポートをリストする非常に優れたワンストップリソースです。 html5 apis。

単一のリソースは実際には存在しませんが(少なくとも私が知っていることはありません)、私がそれに遭遇したいくつかのリソースが一緒になって、ブラウザのどの機能がサポートされているかのかなり良い概要を形成します。特に、まだサポートしなければならない可能性のあるIEの古いバージョン。

キーテイクアウト

JavaScriptとDOMの互換性のための包括的なリソースは1つもありませんが、いくつかのリソースは、さまざまなブラウザにわたる機能サポートの適切な概要を提供します。これらには、MDNのリファレンス、Peter-Paul KochによるQuirksmode DOMリファレンス、Cody LindleyによるWebブラウザ互換性テーブル、Tobias Buschor、Dottoro Javascript Webリファレンス、IE Dev Center Javascript、Dom Reference、ecmascriptによるビッグJS互換性テーブルの使用が含まれます。 Kangax/Arnottによる互換性テーブル、およびThijsによるJavaScriptの互換性チェッカーBUSSER。

    サポートする必要があるさまざまなデバイスとブラウザでの実際のテストは、常に互換性を決定するための主要な方法である必要があります。 「サポート」テーブルには、機能を使用できない可能性のある関連バグが常に含まれているとは限りません。また、一部のリソースが間違っている可能性があります。
  • MDNのリファレンスは、必要な情報を使用できない場合に適した出発点です。さまざまなJavaScript機能のサポートの予備概要を提供します。また、誰でも編集可能なので、誤った情報を見つけた場合は、更新できます。
  • Thijs BusserによるJavaScript互換性チェッカーは、JavaScriptコードを貼り付けたりアップロードしたりして、コードの互換性の分析を取得できる新しいツールです。 Kangaxテーブルの情報を使用して、ES5以降に追加された新しいAPIと機能に焦点を当てて使用できます。ただし、それでも新しいものであり、常に正確な結果が得られるとは限りません。
  • もちろん、実際のテストはすべて
  • に勝るものです
  • リソースに入る前に、サポートしなければならないさまざまなデバイスやブラウザで実際のテストを行うことは言うまでもなく、常にサポートを決定するための主要な方法である必要があると思います。

    サポートの中古概要を取得できてうれしいです。ただし、「サポート」テーブルには、問題の機能を使用できない可能性のある関連するバグが常に含まれるとは限りません。そして、それはいくつかのリソースがただ間違っている可能性があるという事実に加えてです。

    では、テストを行い、この記事で説明されている参照をガイドとして使用してください。特定のデバイスの特定のプラットフォームの特定のブラウザで何かが機能するかどうかについての最終的な言葉としてではありません。

    mdnのリファレンス

    で何かが見つからない場合は、

    を使用できますか?そして、私はあなたのほとんどがまさにそれをしていると確信しています。ほとんどの場合、特定のJavaScript機能のサポートの適切な予備概要を取得するために必要なのは、> を使用できますか? たとえば、addeventlistener()およびremoveEventListener()を調べたいとします。

    を使用できませんか?ただし、ブラウザ情報でMDNで両方を見つけることができます。

    上記の画面グラブでわかるように、どのブラウザが「基本的なサポート」を持っているかを示す詳細に加えて、ECMAScriptの後のバージョンに追加された可能性のある機能に関するそのチャートに追加情報がよくあります。

    MDNのリファレンスは誰でも編集可能であることを忘れないでください。したがって、何かが間違っていることがわかった場合は、自由に更新してください。 Peter-Paul KochによるQuirksmode Dom Reference

    JavaScriptおよびDOM互換性テーブルのリソースブラウザの互換性テーブルに関する議論は、ピーター・ポール・コッホと彼の優れたリファレンステーブルに言及せずに完了しません。これらはすべて彼自身のテストに基づいています。

    Kochのテーブルには、デスクトップおよびモバイルブラウザのサポート情報が含まれています。Domのものはかなり最新であるように見え、IE11とiOS7のサポートを示しています。 Cody Lindley

    によるWebブラウザー互換性テーブル

    これはあまりにもよく知られていないように見えるものです。CodyLindleyによって構築されました。これは、Webブラウザー互換性テーブル(WBCT)と呼ばれ、マンモスリソースです。

    CodyのWebサイトには、IE6に戻るサポート表が含まれており、以下が含まれています。 JavaScriptおよびDOM互換性テーブルのリソース デスクトップおよびタブレット/電話ブラウザのdomサポート

    デスクトップおよびタブレット/電話ブラウザのDOMイベントサポート

    デスクトップおよびタブレット/電話ブラウザのES6サポート

    これらは、JavaScriptサポート情報を研究する開発者の主要な分野ですが、WBCTにはCSS、BOM、SVGなどのサポートテーブルも含まれています。それで、必ずそれをブックマークしてください。 MDNを徹底的に補完するものとして機能しますTobias Buschor

    による大きなJS互換性テーブルこれは間違いなくあまり知られていませんが、Cody Lindleyのテーブルに含まれていないものやMDNで十分に文書化されていないものがあるかもしれません。

    Tobias Buschorによって作成された大きなJS互換性テーブルです。

    JavaScriptおよびDOM互換性テーブルのリソースこれも巨大なリソースであり、特定のJavaScriptまたはDOM機能にドリルダウンできる方法が本当に好きです。たとえば、最初のリスト(ウィンドウオブジェクトから始まる)をスクロールすると、StorageEventのようなものをクリックすると、その特定のオブジェクトのメソッドとプロパティのリストが表示されます。

    これは本当に包括的なリソースですが、時々遅くなる可能性があり、主要なサイトにはいくつかのエラーが発生しているように見えるので、トビアスがリソースを維持しているかどうかはわかりません。 。JavaScriptおよびDOM互換性テーブルのリソース

    他の場所であまり文書化されていない特定の機能を見ている場合、私は通常、これを3番目または4番目の可能性として使用します。

    dottoro javascript webリファレンス

    ITサービス会社であるDottoroが維持しているDottoro JavaScriptのリファレンスは、多くの異なるJavaScriptとDOM機能のためのかなりまともなリソースです。

    ブラウザのサポートがいっぱいになっている場合、すべてのバージョンで、これを示すブラウザアイコン、またはサポートの欠如を示す洗浄されたアイコンが表示されます。また、サポートが特定のバージョンで始まる場合、これも示されます。これは、以下のスクリーンショットで見ることができます:

    JavaScriptおよびDOM互換性テーブルのリソースブラウザのサポートに加えて、これはあなたが見上げている機能の簡単な説明も提供しているので、それは少しボーナスです。

    私がこのリソースについて本当に気に入っているのは素晴らしい検索機能です。これは、最初にサイトにアクセスしたときにそれほど明白ではありません。 2つの「名前で閲覧する」ボタンのいずれかをクリックすることにより、ライトボックスウィンドウでトリガーされます。横方向のボタンは、以下のスクリーンショットに示されています:

    JavaScriptおよびDOM互換性テーブルのリソース

    メインページで直接検索することもできますが、最初に結果ページを表示するのではなく、タイプのものに基づいて結果を即座にフィルタリングするため、ライトボックスで検索が好きです。

    全体として、Dottoroリファレンスは、HTMLおよびCSS機能のブラウザサポート情報も含まれる優れた魅力的なリソースです。

    IE DEV Center JavaScriptおよびDOM Reference

    通常、ブラウザのサポートについて疑問に思っているとき、それはIEの古いバージョン(現在はIE9とIE10を含む現在、今日の基準で「古い」と見なされている)に関する情報が必要だからです。

    MicrosoftのInternet Explorer Dev Centerには、JavaScriptとDOM機能に関する詳細なサポート情報を備えた良いページがたくさんあります。

    JavaScriptおよびDOM互換性テーブルのリソース たとえば、

    JavaScriptバージョン情報ページにアクセスできます。これには、IE6-11のサポート情報が記載されたテーブルの多くの機能がリストされています。また、各機能をドリルダウンして、最終的に単一の機能に捧げられたページに登場することもできます。

    したがって、マップオブジェクトのforeachメソッドのページにドリルダウンすると、その機能のセクションとともにその機能の説明が表示されます。 >

    それは、検索できるもののほんの小さなサンプリングです。また、DOMリファレンス、Webアプリケーションリファレンス(HTML5 APIの多くをカバーする)、およびCanvas、Audio/Video API、SVG、およびWebGLをカバーするグラフィックスとメディアリファレンスもあります。 JavaScriptおよびDOM互換性テーブルのリソースこれらのIE開発センター参照ページにおける唯一の実際の欠陥は、IEブラウザーのサポートのみをカバーするという事実です。しかし、IEは通常、ブラウザのサポートに関する情報を調べている主な理由であるため、それは大したことではありません。 Kangax/Arnottによるecmascriptの互換性テーブル

    ecmascriptの互換性テーブル

    参照には、ES5、ES6、ES7、および非標準機能の互換性情報をカバーする表が含まれています。

    ボーナス:JavaScriptの互換性チェッカーThijs Busser

    これは、JavaScript Compatibility Checker(JSCC)と呼ばれるThijs Busserによって構築された新しいツールです。これにより、JavaScriptを貼り付けたりアップロードしたり、コードの分析を取得したりできます。

    ツールはKangaxテーブルからの情報を使用し、 JavaScriptおよびDOM互換性テーブルのリソース

    それがどのように機能するかを示すために、このMDN記事からWebワーカーに関するコードを追加しました。示されている結果に注意してください:

    ここでは、互換性の問題があるコードで使用されている機能(つまり、100%未満のサポートがあり、ブラウザが問題を引き起こすことがあります。

    このツールは新しく、おそらくいくつかの改善を使用できることを警告します。たとえば、データセットプロパティを使用する一部のコードに貼り付けた場合、JSCCは、コードに互換性の問題がないことを教えてくれます。しかし、MDNは、IE10以下ではサポートされていないと言います。これは、データセットが使用できますが、使用できるので、結果は正確になるはずです。

    したがって、これは完全で完全なツールではありませんが、改善するにつれて目を光らせておくべきことは確かです。 結論

    前述のように、実際のテストは常に互換性に関する情報の主要な手段でなければなりません。また、すべてのJavaScriptとDOM機能の完全なブラウザ互換性情報を備えたソースはどこにもあるとは思いません。しかし、私がこの投稿にリストしたリソースは、かなり正確な情報のためにあなたが頼ることができる集合体として役立つと思います。

    もちろん、私が見逃したものがあったかもしれません。したがって、別のソースを知っている場合は、コメントにお気軽に追加してください。

    JavaScript Domの互換性表

    に関するよくある質問(FAQ)

    JavaScript DOM互換性のテーブルとは?

    JavaScriptドキュメントオブジェクトモデル(DOM)互換性テーブルは、さまざまなWebブラウザーにわたるさまざまなWebテクノロジーの互換性に関する情報を提供する包括的なリソースです。 JavaScript、HTML、CSS、およびその他のWeb標準の詳細が含まれています。これらのテーブルは、どのブラウザーによってサポートされているかを理解するのに役立つ開発者にとって重要です。すべてのプラットフォームで動作するコードを作成できるようにします。 🎜> JavaScript DOM互換性テーブルを使用するのは簡単です。テーブルは通常、行と列に分割され、各行は特定の機能またはプロパティを表し、各列は異なるブラウザを表します。機能が特定のブラウザでサポートされているかどうかを確認するには、行の機能を配置して、目的のブラウザの列に進みます。セルがサポートされているとマークされている場合、ブラウザがその機能をサポートすることを意味します。さまざまなブラウザにわたるさまざまなWebテクノロジーの互換性を迅速かつ簡単に確認します。これは重要です。すべてのブラウザがすべての機能をサポートしているわけではなく、特定のブラウザによってサポートされていない機能を使用すると、エラーやユーザーエクスペリエンスの低下につながる可能性があります。互換性のあるテーブルを使用することにより、開発者はすべてのプラットフォームでコードが正しく機能することを保証できます。

    ecmascriptとjavascriptの違いは何ですか?

    ecmascriptは、ECMA Internationalが標準化されたスクリプト言語仕様です。 JavaScriptは、この仕様に準拠するプログラミング言語です。言い換えれば、ECMAScriptは青写真として機能し、JavaScriptはその青写真の実装の1つです。 ActionScriptのような他の言語は、ECMAScriptの仕様にも従います

    JavaScript Domの互換性テーブルが更新される頻度はどれくらいですか?

    JavaScript DOM互換性テーブルの更新の頻度はさまざまです。ただし、通常、Webブラウザーの最新バージョンと最新のWebテクノロジーを反映するために、定期的に更新されます。信頼できる最新の互換性テーブルを使用して、正確な情報を確保することが重要です。

    互換性の表で機能が「部分的なサポート」としてマークされている場合はどういう意味ですか?互換性のあるテーブルでの部分的なサポートは、ブラウザが機能を認識している一方で、そのすべての側面をサポートしないか、既知の問題でそれをサポートすることはないことを意味します。より具体的な情報については、「部分的なサポート」ラベルに関連するメモまたは詳細を確認することをお勧めします。オープンソースプロジェクト。誰でも貢献できることを意味します。これには通常、特定のプロセスを介してデータまたは修正を送信することが含まれます。貢献する前に、プロジェクトの貢献ガイドラインに慣れることが重要です。

    「Caniuse」Webサイトは何ですか?デスクトップおよびモバイルWebブラウザーでフロントエンドWebテクノロジーをサポートするためのテーブルをサポートします。開発者がJavaScript、HTML、CSSなどを含むさまざまなWebテクノロジーの互換性を確認することは貴重なリソースです。互換性テーブルは貴重なリソースであり、ブラウザの互換性を確認する他の方法があります。これらには、「使用できますか」などのオンラインツールの使用、Webテクノロジーの公式ドキュメントのチェック、またはコードの機能検出を使用して、実行時に機能がサポートされているかどうかを判断します。すべてのブラウザで動作しますか?

    すべてのブラウザでコードが動作することを確認するには、JavaScript Dom互換性テーブルを使用して機能サポートを確認し、コードの機能検出を使用し、徹底的なテストを行うことが含まれます。さまざまなブラウザとデバイス。また、最新のWeb標準とブラウザの更新を最新の状態に保つことも重要です。

以上がJavaScriptおよびDOM互換性テーブルのリソースの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
JavaScriptの文字列文字を交換しますJavaScriptの文字列文字を交換しますMar 11, 2025 am 12:07 AM

JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか?独自のJavaScriptライブラリを作成および公開するにはどうすればよいですか?Mar 18, 2025 pm 03:12 PM

記事では、JavaScriptライブラリの作成、公開、および維持について説明し、計画、開発、テスト、ドキュメント、およびプロモーション戦略に焦点を当てています。

ブラウザでのパフォーマンスのためにJavaScriptコードを最適化するにはどうすればよいですか?ブラウザでのパフォーマンスのためにJavaScriptコードを最適化するにはどうすればよいですか?Mar 18, 2025 pm 03:14 PM

この記事では、ブラウザでJavaScriptのパフォーマンスを最適化するための戦略について説明し、実行時間の短縮、ページの負荷速度への影響を最小限に抑えることに焦点を当てています。

jQueryマトリックス効果jQueryマトリックス効果Mar 10, 2025 am 12:52 AM

マトリックスの映画効果をあなたのページにもたらしましょう!これは、有名な映画「The Matrix」に基づいたクールなJQueryプラグインです。プラグインは、映画の古典的な緑色のキャラクター効果をシミュレートし、画像を選択するだけで、プラグインはそれを数値文字で満たされたマトリックススタイルの画像に変換します。来て、それを試してみてください、それはとても面白いです! それがどのように機能するか プラグインは画像をキャンバスにロードし、ピクセルと色の値を読み取ります。 data = ctx.getimagedata(x、y、settings.greasize、settings.greasize).data プラグインは、写真の長方形の領域を巧みに読み取り、jQueryを使用して各領域の平均色を計算します。次に、使用します

ブラウザ開発者ツールを使用してJavaScriptコードを効果的にデバッグするにはどうすればよいですか?ブラウザ開発者ツールを使用してJavaScriptコードを効果的にデバッグするにはどうすればよいですか?Mar 18, 2025 pm 03:16 PM

この記事では、ブラウザ開発者ツールを使用した効果的なJavaScriptデバッグについて説明し、ブレークポイントの設定、コンソールの使用、パフォーマンスの分析に焦点を当てています。

シンプルなjQueryスライダーを構築する方法シンプルなjQueryスライダーを構築する方法Mar 11, 2025 am 12:19 AM

この記事では、jQueryライブラリを使用してシンプルな画像カルーセルを作成するように導きます。 jQuery上に構築されたBXSLiderライブラリを使用し、カルーセルをセットアップするために多くの構成オプションを提供します。 今日、絵のカルーセルはウェブサイトで必須の機能になっています - 1つの写真は千の言葉よりも優れています! 画像カルーセルを使用することを決定した後、次の質問はそれを作成する方法です。まず、高品質の高解像度の写真を収集する必要があります。 次に、HTMLとJavaScriptコードを使用して画像カルーセルを作成する必要があります。ウェブ上には、さまざまな方法でカルーセルを作成するのに役立つ多くのライブラリがあります。オープンソースBXSLiderライブラリを使用します。 BXSLiderライブラリはレスポンシブデザインをサポートしているため、このライブラリで構築されたカルーセルは任意のものに適合させることができます

JavaScriptによる構造マークアップの強化JavaScriptによる構造マークアップの強化Mar 10, 2025 am 12:18 AM

キーポイントJavaScriptを使用した構造的なタグ付けの強化は、ファイルサイズを削減しながら、Webページコンテンツのアクセシビリティと保守性を大幅に向上させることができます。 JavaScriptを効果的に使用して、Cite属性を使用して参照リンクを自動的にブロック参照に挿入するなど、HTML要素に機能を動的に追加できます。 JavaScriptを構造化されたタグと統合することで、ページの更新を必要としないタブパネルなどの動的なユーザーインターフェイスを作成できます。 JavaScriptの強化がWebページの基本的な機能を妨げないようにすることが重要です。 高度なJavaScriptテクノロジーを使用できます(

Angularを使用してCSVファイルをアップロードおよびダウンロードする方法Angularを使用してCSVファイルをアップロードおよびダウンロードする方法Mar 10, 2025 am 01:01 AM

データセットは、APIモデルとさまざまなビジネスプロセスの構築に非常に不可欠です。これが、CSVのインポートとエクスポートが頻繁に必要な機能である理由です。このチュートリアルでは、Angular内でCSVファイルをダウンロードおよびインポートする方法を学びます

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

SublimeText3 Linux 新バージョン

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

PhpStorm Mac バージョン

PhpStorm Mac バージョン

最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境