問題タブ [browser-feature-detection]

Web ブラウザーが異なれば、window.close() 関数の処理も異なります。IE はユーザーに確認を求めますが、Firefox と Safari は、ウィンドウが最初に Javascript で開かれ、コンソールに同様のメッセージが表示されない限り、それを尊重しません。

私がサポートしている組織内で使用されているサードパーティの Web アプリケーションは、ウィザードのような一連のページの最後に「閉じる」ボタンを表示します。これは、大多数のユーザーが使用する IE でうまく機能します。しかし、これはFFでは明らかに失敗します。window.close() を実行しないブラウザではボタンを表示しないようにして、ボタンをそのままにして Javascript を使用して UI を適切に劣化させたいと思います。

経験則として、可能な限り、ブラウザーの検出に基づいてハードコーディングされたポリシーに依存するのではなく、ブラウザーの機能をチェックするようにしています。window.close() のサポートをプログラムでチェックして、最初にボタンを表示する必要があるかどうかを判断する方法はありますか?

プレースホルダーのサポートをテストする必要があります。以下は、IE7、IE8、IE9だけでなく、すべての最新のブラウザーでうまく機能します。

inそれは動作しますが、JSLintは：の使用について不平を言います。

予期しない'in'。undefinedと比較するか、代わりにhasOwnPropertyメソッドを使用してください。

いいので、これにリファクタリングします：

これで、エラーや警告なしでJSLintに合格しますが、IE7とIE8ではこの古い栗で壊れます。

オブジェクトはプロパティまたはメソッドをサポートしていません'hasOwnProperty'

JSLint、およびIE7とIE8を幸せにする方法はありますか？

HTML5 オーディオ再生が利用可能かどうかを Javascript でチェックする方法を知っています。しかし、Firefox と Opera はサポートしていませんが、IE9 と Chrome はサポートしているため、MP3 オーディオの再生が利用可能かどうかを具体的に確認するにはどうすればよいでしょうか。

IE ハンドルMJPEG( Motion JPEG ) を除く最新のブラウザ。これがフィドルの例です。

のサポートを検出できますMJPEGか? Modernizrを無駄に調べました。

JavaScriptを介してブラウザでcss疑似クラスのサポートを検出する概念は何ですか？:checked正確には、ユーザーのブラウザーが疑似クラスをサポートしているかどうかを確認したいと思います。チェックボックス付きのCSSポップアップをいくつか作成し、古いブラウザーのフォールバックを実行する必要があるためです。

答え： Modernizrの「AdditionalTests」でcssセレクターをテストする方法がすでに実装されていることがわかりました。

サイト内のページの階層を表すことになっている選択ドロップダウンがあります。

構造はバックエンドで作成され、cssを使用してスタイル設定されます。

これにより、各ページがサイト階層内にある深さに応じてインデントされた、より深いレベルのオプションが表示されます。ただし、このスタイルはFireFoxでのみ機能し、Chromeでは機能しません。コントロールのスタイルはブラウザとオペレーティングシステムの間で大きく不均一であることを知っているので、そこには行きません。代わりに、階層を表示するために、各オプションのテキストの前に「-」文字を追加したいと思います。このプロジェクトではIEをまったくサポートしていないため、これをChromeで行う必要があるだけです。

オブジェクトのテキストの操作はjavascriptで行われます。

私の質問はこれです：

ブラウザの検出は推奨されておらず、代わりに機能の検出が優先されることを知っているので、このブラウザの動作に対して機能の検出を実行するにはどうすればよいですか？これが不可能な場合、Chrome/webkitまたはFirefox/Geckoのどちらを使用しているかを知るための簡単なテストはありますか？

http://www.modernizr.comがブラウザを機能検出して本体にクラスを追加するのと同様に、デバイスがFlashをサポートしているかどうかをテストする方法はありますか？

Modernizr で機能を検出する方法と同様に、ブラウザーが iOS で実行されているかどうかを検出できるかどうか疑問に思っています (ただし、これは明らかに機能検出ではなくデバイス検出です)。

通常は代わりに機能検出を優先しますが、デバイスが iOS であるかどうかを確認する必要があるのは、この質問YouTube API が iPad / iPhone / 非フラッシュ デバイスで動作しないに従ってビデオを処理する方法のためです。

機能検出を使用して、他の誰かが作成したプラグインを作成し、実際に機能する/サポートされているすべてのブラウザーで機能させるにはどうすればよいですか。プラグインのドキュメントには、IE 8でサポートされていると記載されていますが、実際には機能しません。信頼性の低いブラウザ検出が原因であることはわかっていますが、実際に機能する可能性のあるすべてのブラウザで機能させるにはどうすればよいですか？

詳細

特定の例を示すために、私はjQueryが選択したプラグインバージョン0.9.7を使用しており、ドキュメントに記載されているように-

最新のブラウザはすべてサポートされています（Firefox、Chrome、Safari、IE9）。IE8のレガシーサポートも有効になっています。

ただし、多くのIE 8では機能しないが、IEテスターIE 8では機能することがわかりました。次に、プラグインコード内で、プラグインロジックから単純に脱出するこのブラウザー検出ロジックを見つけました-

そして、それ$.browser.versionが私のIE 8で7.0を返していて、それが機能していなかった理由であることがわかりました。まあ、驚くべきことは何もありません、私は知っています。$.browser.version === "7.0"IE 8で実際に機能するかどうかを確認するために、条件を削除してみました。しかし、プラグインの作成者がそれを行っており、彼はもっとよく知っているに違いないので、私はその状態を取り除くことはできません。

さて、私の質問は、機能検出を使用して、実際に機能するすべてのブラウザーで機能させる方法です。論理的なステップは、このプラグインで使用されているすべてのブラウザー機能を見つけることだと思います。では、どうすればそれを見つけることができますか？これに関する私の限られた知識をご容赦ください。私は、機能の検出、ブラウザの検出よりも優れていることなどの理論的な知識を持っていますが、機能の検出を行うコードを実際に使用したことはありません。私はこれについて約1〜2年前に学びました。

そして今回検索したところ、 Modernizerのことを知りました。これは役に立ちますか？次世代のHTML5およびCSS3を利用したWebサイトを構築するためのものであり、HTML5、CSS3はまだあまり使用されていないため、わかりません。または、プラグインに必要なすべての機能がわかったら、jQuery.supportで十分です。

いくつかのさらなる推論

私はこの質問を見つけましたオブジェクト/機能の検出によるブラウザの検出ここで、作成者は、機能検出を使用してブラウザーが実際に何であるかを把握できるかどうかを尋ねます。あるコメントによると、「機能検出の全体的なポイントは、ブラウザが実際に必要な機能を備えているかどうかを確認できるようにすることです。正しく行うと、実際にはブラウザが何であるかは気にせず、ただそれが必要かどうかだけが気になります。仕事をするのに必要な機能があります。」私はこれを理解して同意しますが、特定のプラグインがこれらのブラウザーでサポートされていると言うことのポイントは何ですか。プラグインの作成者が必要なすべての機能をリストアップして、人々が使いやすいようにしないのはなぜですか？しかし、サポートされているブラウザーをリストすることの背後にあるポイントは、理想的なブラウザーを想定することによって互換性のアイデアを提供しているように見えます。

たとえば、2つの理想的なIE 6ブラウザーでは、ポップアップdivに干渉する同じ選択ドロップダウンz-indexの問題が発生します。プラグインに問題があるとします。このプラグインがIE6と互換性がないと言うことは、理想的なIE 6ブラウザーであり、ユーザーエージェントが調整されてブラウザーバージョンとしてIE6を返す別のIE8ブラウザーではないことを意味します。

その場合（サポートされているブラウザーのリストの背後にあるポイントは、理想的なブラウザーを想定して互換性のアイデアを提供しているだけです）、機能検出を使用してブラウザーを識別することは理にかなっていますか？もしそうなら、なぜ多くのサンプルスニペットが利用できないのですか？

たくさんの質問..:)私は推測します、今日私はそれをすべて尋ねました...

Firefox10でのみ実際にテストされたさまざまなCSS3スタイルを使用するWebサイトがあります。IE8で表示したときにネイティブにサポートされていないさまざまなCSSスタイルをシミュレートする方法が必要です。

• ボックスシャドウ
• テキストシャドウ
• 背景のグラデーション
• 丸い角
• 不透明度

css3pieを使用してみましたが、.htcファイルを含めると、不快な副作用が発生しました。IE8の要素にボックスシャドウと丸い角を追加できるjQueryプラグインがあることを知っているので、これらを条件付きコードブロック内で使用することを検討しています。

機能検出ではなくブラウザ検出を使用しているため、これはやや脆弱であることに気付きましたが、jQuery.supportを使用して角を丸める機能などの機能を検出する方法を見つけることができません。

次に、CSS3プロパティの一部（ボックスシャドウと丸い角）をシミュレートできるjQueryプラグインしか認識していませんが、背景のグラデーション、不透明度、テキストシャドウ用の他のプラグインはありますか？

最後に、私の目標を達成するためのまったく異なる方法がある場合は、別の方法を提案してください。