jQuery と JavaScript を使用してサーバー上のファイルの存在を確認するにはどうすればよいですか?

jQuery と JavaScript を使用したファイルの存在の確認

サーバー上のファイルの存在を確認することは、さまざまな Web 開発シナリオにおいて重要です。この包括的なガイドでは、jQuery と純粋な JavaScript を使用する 2 つの実践的なアプローチについて説明します。

jQuery メソッド

jQuery は、XHR と純粋な JavaScript を使用してファイルの存在を確認するエレガントな方法を提供します。 HEAD リクエスト タイプ。次のコードは、このアプローチを示しています。

$.ajax({
    url:'http://www.example.com/somefile.ext',
    type:'HEAD',
    error: function()
    {
        // File does not exist
    },
    success: function()
    {
        // File exists
    }
});

純粋な JavaScript メソッド

jQuery を使用しない場合、純粋な JavaScript は XMLHttpRequest オブジェクトを使用して同様の機能を提供します。効果的な実装は次のとおりです。

function UrlExists(url)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status!=404;
}

上記のコードは 404 HTTP ステータス コードをチェックしていることに注意してください。成功したステータス コード (200 など) を確認するには、次の変更を加えます。

function UrlExists(url)
{
    var http = new XMLHttpRequest();
    http.open('HEAD', url, false);
    http.send();
    return http.status == 200;
}

JavaScript の非同期代替

同期 XMLHttpRequest は非推奨であるため、次の非同期ユーティリティ メソッド:

function executeIfFileExist(src, callback) {
    var xhr = new XMLHttpRequest()
    xhr.onreadystatechange = function() {
        if (this.readyState === this.DONE) {
            callback()
        }
    }
    xhr.open('HEAD', src)
}

以上がjQuery と JavaScript を使用してサーバー上のファイルの存在を確認するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。