Lihat kode:

var file1 = "50.xsl";
var file2 = "30.doc";
getFileExtension(file1); //returns xsl
getFileExtension(file2); //returns doc

function getFileExtension(filename) {
    /*TODO*/
}

Sunting yang Lebih Baru: Banyak hal telah berubah sejak pertanyaan ini awalnya diposting - ada banyak informasi yang benar-benar bagus dalam jawaban revisi wallacer serta rincian VisioN yang luar biasa

Sunting: Hanya karena ini adalah jawaban yang diterima; Jawaban wallacer memang jauh lebih baik:

return filename.split('.').pop();

Jawaban lama saya:

return /[^.]+$/.exec(filename);

Harus melakukannya.

Sunting: Menanggapi komentar PhiLho, gunakan sesuatu seperti:

return (/[.]/.exec(filename)) ? /[^.]+$/.exec(filename) : undefined;

return filename.split('.').pop();

Sederhanakan :)

Edit:

Ini adalah solusi non-regex lain yang saya yakin lebih efisien:

return filename.substring(filename.lastIndexOf('.')+1, filename.length) || filename;

Ada beberapa kasus sudut yang lebih baik ditangani oleh jawaban VisioN di bawah ini, terutama file tanpa ekstensi ( .htaccesstermasuk dll).

Ini sangat berkinerja, dan menangani kasus sudut dengan cara yang bisa dibilang lebih baik dengan mengembalikan ""bukan string penuh ketika tidak ada titik atau tidak ada string sebelum titik. Ini solusi yang dibuat dengan sangat baik, meskipun sulit untuk dibaca. Tempelkan di lib pembantu Anda dan gunakan saja.

Edit Lama:

Implementasi yang lebih aman jika Anda akan menjalankan file tanpa ekstensi, atau file tersembunyi tanpa ekstensi (lihat komentar VisioN untuk jawaban Tom di atas) akan menjadi sesuatu di sepanjang baris ini

var a = filename.split(".");
if( a.length === 1 || ( a[0] === "" && a.length === 2 ) ) {
    return "";
}
return a.pop();    // feel free to tack .toLowerCase() here if you want

Jika a.lengthsatu, itu adalah file yang terlihat tanpa ekstensi yaitu. mengajukan

Jika a[0] === ""dan a.length === 2itu adalah file tersembunyi yaitu tanpa ekstensi. .htaccess

Semoga ini bisa membantu menyelesaikan masalah dengan kasus yang sedikit lebih kompleks. Dalam hal kinerja, saya percaya solusi ini sedikit lebih lambat daripada regex di sebagian besar browser. Namun, untuk tujuan paling umum kode ini harus dapat digunakan dengan sempurna.

Solusi berikut ini cepat dan cukup pendek untuk digunakan dalam operasi massal dan menghemat byte tambahan:

 return fname.slice((fname.lastIndexOf(".") - 1 >>> 0) + 2);

Berikut ini adalah satu lagi solusi universal non-regexp:

 return fname.slice((Math.max(0, fname.lastIndexOf(".")) || Infinity) + 1);

Keduanya berfungsi dengan benar dengan nama yang tidak memiliki ekstensi (mis. Myfile ) atau dimulai dengan .titik (misalnya .htaccess ):

 ""                            -->   ""
 "name"                        -->   ""
 "name.txt"                    -->   "txt"
 ".htpasswd"                   -->   ""
 "name.with.many.dots.myext"   -->   "myext"

Jika Anda peduli dengan kecepatannya, Anda dapat menjalankan tolok ukur dan memeriksa apakah solusi yang disediakan adalah yang tercepat, sedangkan solusi singkatnya sangat cepat:

Cara kerja yang singkat:

1. String.lastIndexOfMetode mengembalikan posisi terakhir dari substring (yaitu ".") dalam string yang diberikan (yaitu fname). Jika substring tidak ditemukan metode akan dikembalikan -1.
2. Posisi "tidak dapat diterima" dari titik dalam nama file adalah -1dan 0, yang masing-masing merujuk pada nama tanpa ekstensi (misalnya "name") dan nama yang dimulai dengan titik (misalnya".htaccess" ).
3. Operator pergeseran kanan isi nol ( >>>) jika digunakan dengan nol memengaruhi angka negatif yang mentransformasikan -1ke 4294967295dan -2menjadi 4294967294, yang berguna untuk mempertahankan nama file tidak berubah dalam case edge (semacam trik di sini).
4. String.prototype.slicemengekstrak bagian nama file dari posisi yang dihitung seperti yang dijelaskan. Jika nomor posisi lebih dari panjang metode string kembali "".

Jika Anda menginginkan solusi yang lebih jelas yang akan bekerja dengan cara yang sama (ditambah dengan dukungan ekstra dari path lengkap), periksa versi lanjutan berikut. Solusi ini akan lebih lambat dari one-liners sebelumnya tetapi lebih mudah dipahami.

function getExtension(path) {
    var basename = path.split(/[\\/]/).pop(),  // extract file name from full path ...
                                               // (supports `\\` and `/` separators)
        pos = basename.lastIndexOf(".");       // get last position of `.`

    if (basename === "" || pos < 1)            // if file name is empty or ...
        return "";                             //  `.` not found (-1) or comes first (0)

    return basename.slice(pos + 1);            // extract extension ignoring `.`
}

console.log( getExtension("/path/to/file.ext") );
// >> "ext"

Ketiga varian harus bekerja di browser web apa pun di sisi klien dan dapat digunakan dalam kode NodeJS sisi server juga.

function getFileExtension(filename)
{
  var ext = /^.+\.([^.]+)$/.exec(filename);
  return ext == null ? "" : ext[1];
}

Diuji dengan

"a.b"     (=> "b") 
"a"       (=> "") 
".hidden" (=> "") 
""        (=> "") 
null      (=> "")  

Juga

"a.b.c.d" (=> "d")
".a.b"    (=> "b")
"a..b"    (=> "b")

function getExt(filename)
{
    var ext = filename.split('.').pop();
    if(ext == filename) return "";
    return ext;
}

var extension = fileName.substring(fileName.lastIndexOf('.')+1);

var parts = filename.split('.');
return parts[parts.length-1];

function file_get_ext(filename)
    {
    return typeof filename != "undefined" ? filename.substring(filename.lastIndexOf(".")+1, filename.length).toLowerCase() : false;
    }

Kode

/**
 * Extract file extension from URL.
 * @param {String} url
 * @returns {String} File extension or empty string if no extension is present.
 */
var getFileExtension = function (url) {
    "use strict";
    if (url === null) {
        return "";
    }
    var index = url.lastIndexOf("/");
    if (index !== -1) {
        url = url.substring(index + 1); // Keep path without its segments
    }
    index = url.indexOf("?");
    if (index !== -1) {
        url = url.substring(0, index); // Remove query
    }
    index = url.indexOf("#");
    if (index !== -1) {
        url = url.substring(0, index); // Remove fragment
    }
    index = url.lastIndexOf(".");
    return index !== -1
        ? url.substring(index + 1) // Only keep file extension
        : ""; // No extension found
};

Uji

Perhatikan bahwa jika tidak ada kueri, fragmen mungkin masih ada.

"https://www.example.com:8080/segment1/segment2/page.html?foo=bar#fragment" --> "html"
"https://www.example.com:8080/segment1/segment2/page.html#fragment"         --> "html"
"https://www.example.com:8080/segment1/segment2/.htaccess?foo=bar#fragment" --> "htaccess"
"https://www.example.com:8080/segment1/segment2/page?foo=bar#fragment"      --> ""
"https://www.example.com:8080/segment1/segment2/?foo=bar#fragment"          --> ""
""                                                                          --> ""
null                                                                        --> ""
"a.b.c.d"                                                                   --> "d"
".a.b"                                                                      --> "b"
".a.b."                                                                     --> ""
"a...b"                                                                     --> "b"
"..."                                                                       --> ""

JSLint

0 Peringatan.

Cepat dan berfungsi dengan benar dengan jalur

(filename.match(/[^\\\/]\.([^.\\\/]+)$/) || [null]).pop()

Beberapa tepi kasus

/path/.htaccess => null
/dir.with.dot/file => null

Solusi menggunakan split lambat dan solusi dengan lastIndexOf tidak menangani kasus tepi.

Saya hanya ingin membagikan ini.

fileName.slice(fileName.lastIndexOf('.'))

walaupun ini memiliki kejatuhan bahwa file tanpa ekstensi akan mengembalikan string terakhir. tetapi jika Anda melakukannya, ini akan memperbaiki semua hal:

   function getExtention(fileName){
     var i = fileName.lastIndexOf('.');
     if(i === -1 ) return false;
     return fileName.slice(i)
   }

Saya yakin seseorang dapat, dan akan, meminimalkan dan / atau mengoptimalkan kode saya di masa depan. Tetapi, pada saat ini , saya yakin 200% bahwa kode saya berfungsi dalam setiap situasi unik (misalnya hanya dengan nama file saja , dengan relatif , relatif-root , dan URL absolut , dengan tag fragmen # , dengan string kueri ? , dan apa pun selain itu Anda dapat memutuskan untuk melemparnya), tanpa cacat, dan dengan presisi titik-pin.

Sebagai bukti, kunjungi: https://projects.jamesandersonjr.com/web/js_projects/get_file_extension_test.php

Inilah JSFiddle: https://jsfiddle.net/JamesAndersonJr/ffcdd5z3/

Bukan untuk terlalu percaya diri, atau meniup trompet saya sendiri, tetapi saya belum melihat adanya blok kode untuk tugas ini (menemukan ekstensi file yang 'benar' , di tengah-tengah baterai functionargumen input yang berbeda ) yang berfungsi sebaik ini.

Catatan: Sesuai desain, jika ekstensi file tidak ada untuk string input yang diberikan, itu hanya mengembalikan string kosong "", bukan kesalahan, atau pesan kesalahan.

Dibutuhkan dua argumen:

• String: fileNameOrURL (cukup jelas)

• Boolean: showUnixDotFiles (Apakah atau tidak untuk menunjukkan file yang dimulai dengan titik ".")

Catatan (2): Jika Anda menyukai kode saya, pastikan untuk menambahkannya ke perpustakaan js Anda, dan / atau repo, karena saya bekerja keras untuk menyempurnakannya, dan akan sangat disayangkan untuk sia-sia. Jadi, tanpa basa-basi lagi, ini dia:

function getFileExtension(fileNameOrURL, showUnixDotFiles)
    {
        /* First, let's declare some preliminary variables we'll need later on. */
        var fileName;
        var fileExt;

        /* Now we'll create a hidden anchor ('a') element (Note: No need to append this element to the document). */
        var hiddenLink = document.createElement('a');

        /* Just for fun, we'll add a CSS attribute of [ style.display = "none" ]. Remember: You can never be too sure! */
        hiddenLink.style.display = "none";

        /* Set the 'href' attribute of the hidden link we just created, to the 'fileNameOrURL' argument received by this function. */
        hiddenLink.setAttribute('href', fileNameOrURL);

        /* Now, let's take advantage of the browser's built-in parser, to remove elements from the original 'fileNameOrURL' argument received by this function, without actually modifying our newly created hidden 'anchor' element.*/ 
        fileNameOrURL = fileNameOrURL.replace(hiddenLink.protocol, ""); /* First, let's strip out the protocol, if there is one. */
        fileNameOrURL = fileNameOrURL.replace(hiddenLink.hostname, ""); /* Now, we'll strip out the host-name (i.e. domain-name) if there is one. */
        fileNameOrURL = fileNameOrURL.replace(":" + hiddenLink.port, ""); /* Now finally, we'll strip out the port number, if there is one (Kinda overkill though ;-)). */  

        /* Now, we're ready to finish processing the 'fileNameOrURL' variable by removing unnecessary parts, to isolate the file name. */

        /* Operations for working with [relative, root-relative, and absolute] URL's ONLY [BEGIN] */ 

        /* Break the possible URL at the [ '?' ] and take first part, to shave of the entire query string ( everything after the '?'), if it exist. */
        fileNameOrURL = fileNameOrURL.split('?')[0];

        /* Sometimes URL's don't have query's, but DO have a fragment [ # ](i.e 'reference anchor'), so we should also do the same for the fragment tag [ # ]. */
        fileNameOrURL = fileNameOrURL.split('#')[0];

        /* Now that we have just the URL 'ALONE', Let's remove everything to the last slash in URL, to isolate the file name. */
        fileNameOrURL = fileNameOrURL.substr(1 + fileNameOrURL.lastIndexOf("/"));

        /* Operations for working with [relative, root-relative, and absolute] URL's ONLY [END] */ 

        /* Now, 'fileNameOrURL' should just be 'fileName' */
        fileName = fileNameOrURL;

        /* Now, we check if we should show UNIX dot-files, or not. This should be either 'true' or 'false'. */  
        if ( showUnixDotFiles == false )
            {
                /* If not ('false'), we should check if the filename starts with a period (indicating it's a UNIX dot-file). */
                if ( fileName.startsWith(".") )
                    {
                        /* If so, we return a blank string to the function caller. Our job here, is done! */
                        return "";
                    };
            };

        /* Now, let's get everything after the period in the filename (i.e. the correct 'file extension'). */
        fileExt = fileName.substr(1 + fileName.lastIndexOf("."));

        /* Now that we've discovered the correct file extension, let's return it to the function caller. */
        return fileExt;
    };

Nikmati! Anda cukup diterima!:

Jika Anda berurusan dengan url web, Anda dapat menggunakan:

function getExt(filepath){
     return filepath.split("?")[0].split("#")[0].split('.').pop();
}

getExt("../js/logic.v2.min.js") // js
getExt("http://example.net/site/page.php?id=16548") // php
getExt("http://example.net/site/page.html#welcome.to.me") // html
getExt("c:\\logs\\yesterday.log"); // log

Demo: https://jsfiddle.net/squadjot/q5ard4fj/

Coba ini:

function getFileExtension(filename) {
  var fileinput = document.getElementById(filename);
  if (!fileinput)
    return "";
  var filename = fileinput.value;
  if (filename.length == 0)
    return "";
  var dot = filename.lastIndexOf(".");
  if (dot == -1)
    return "";
  var extension = filename.substr(dot, filename.length);
  return extension;
}

return filename.replace(/\.([a-zA-Z0-9]+)$/, "$1");

sunting: Anehnya (atau mungkin tidak) $1argumen kedua pada metode ganti tampaknya tidak berfungsi ... Maaf.

Saya baru menyadari bahwa tidak cukup untuk memberi komentar pada jawaban p4bl0, meskipun jawaban Tom jelas memecahkan masalah:

return filename.replace(/^.*?\.([a-zA-Z0-9]+)$/, "$1");

Untuk sebagian besar aplikasi, skrip sederhana seperti

return /[^.]+$/.exec(filename);

akan bekerja dengan baik (seperti yang disediakan oleh Tom). Namun ini bukan bukti bodoh. Ini tidak berfungsi jika nama file berikut disediakan:

image.jpg?foo=bar

Mungkin sedikit berlebihan tetapi saya menyarankan menggunakan url parser seperti ini untuk menghindari kegagalan karena nama file yang tidak dapat diprediksi.

Dengan menggunakan fungsi khusus itu, Anda bisa mendapatkan nama file seperti ini:

var trueFileName = parse_url('image.jpg?foo=bar').file;

Ini akan menampilkan "image.jpg" tanpa url vars. Maka Anda bebas untuk mengambil ekstensi file.

function func() {
  var val = document.frm.filename.value;
  var arr = val.split(".");
  alert(arr[arr.length - 1]);
  var arr1 = val.split("\\");
  alert(arr1[arr1.length - 2]);
  if (arr[1] == "gif" || arr[1] == "bmp" || arr[1] == "jpeg") {
    alert("this is an image file ");
  } else {
    alert("this is not an image file");
  }
}

function extension(fname) {
  var pos = fname.lastIndexOf(".");
  var strlen = fname.length;
  if (pos != -1 && strlen != pos + 1) {
    var ext = fname.split(".");
    var len = ext.length;
    var extension = ext[len - 1].toLowerCase();
  } else {
    extension = "No extension found";
  }
  return extension;
}

//pemakaian

ekstensi ('file.jpeg')

selalu mengembalikan kas ekstensi yang lebih rendah sehingga Anda dapat memeriksanya pada perubahan bidang berfungsi untuk:

file.JpEg

file (tidak ada ekstensi)

mengajukan. (noextension)

Jika Anda mencari ekstensi tertentu dan mengetahui panjangnya, Anda dapat menggunakan substr :

var file1 = "50.xsl";

if (file1.substr(-4) == '.xsl') {
  // do something
}

Referensi JavaScript: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/substr

Saya banyak bulan terlambat ke pesta tetapi untuk kesederhanaan saya menggunakan sesuatu seperti ini

var fileName = "I.Am.FileName.docx";
var nameLen = fileName.length;
var lastDotPos = fileName.lastIndexOf(".");
var fileNameSub = false;
if(lastDotPos === -1)
{
    fileNameSub = false;
}
else
{
    //Remove +1 if you want the "." left too
    fileNameSub = fileName.substr(lastDotPos + 1, nameLen);
}
document.getElementById("showInMe").innerHTML = fileNameSub;

<div id="showInMe"></div>

Ada fungsi perpustakaan standar untuk ini dalam pathmodul:

import path from 'path';

console.log(path.extname('abc.txt'));

Keluaran:

.txt

Jadi, jika Anda hanya menginginkan format:

path.extname('abc.txt').slice(1) // 'txt'

Jika tidak ada ekstensi, maka fungsi tersebut akan mengembalikan string kosong:

path.extname('abc') // ''

Jika Anda menggunakan Node, berarti pathsudah built-in. Jika Anda menargetkan browser, maka Webpack akan membundel pathimplementasi untuk Anda. Jika Anda menargetkan browser tanpa Webpack, maka Anda dapat menyertakan path-browserify secara manual.

Tidak ada alasan untuk melakukan pemisahan string atau regex.

"one-liner" untuk mendapatkan nama file dan ekstensi menggunakan reducedan merusak array :

var str = "filename.with_dot.png";
var [filename, extension] = str.split('.').reduce((acc, val, i, arr) => (i == arr.length - 1) ? [acc[0].substring(1), val] : [[acc[0], val].join('.')], [])

console.log({filename, extension});

dengan lekukan yang lebih baik:

var str = "filename.with_dot.png";
var [filename, extension] = str.split('.')
   .reduce((acc, val, i, arr) => (i == arr.length - 1) 
       ? [acc[0].substring(1), val] 
       : [[acc[0], val].join('.')], [])


console.log({filename, extension});

// {
//   "filename": "filename.with_dot",
//   "extension": "png"
// }

Solusi satu baris yang juga akan menghitung params kueri dan karakter apa pun di url.

string.match(/(.*)\??/i).shift().replace(/\?.*/, '').split('.').pop()

// Example
// some.url.com/with.in/&ot.s/files/file.jpg?spec=1&.ext=jpg
// jpg

Solusi sederhana ini

function extension(filename) {
  var r = /.+\.(.+)$/.exec(filename);
  return r ? r[1] : null;
}

Tes

/* tests */
test('cat.gif', 'gif');
test('main.c', 'c');
test('file.with.multiple.dots.zip', 'zip');
test('.htaccess', null);
test('noextension.', null);
test('noextension', null);
test('', null);

// test utility function
function test(input, expect) {
  var result = extension(input);
  if (result === expect)
    console.log(result, input);
  else
    console.error(result, input);
}

function extension(filename) {
  var r = /.+\.(.+)$/.exec(filename);
  return r ? r[1] : null;
}

Jawaban Wallacer bagus, tetapi diperlukan satu pemeriksaan lagi.

Jika file tidak memiliki ekstensi, itu akan menggunakan nama file sebagai ekstensi yang tidak baik.

Coba yang ini:

return ( filename.indexOf('.') > 0 ) ? filename.split('.').pop().toLowerCase() : 'undefined';

Jangan lupa bahwa beberapa file tidak memiliki ekstensi, jadi:

var parts = filename.split('.');
return (parts.length > 1) ? parts.pop() : '';

var file = "hello.txt";
var ext = (function(file, lio) { 
  return lio === -1 ? undefined : file.substring(lio+1); 
})(file, file.lastIndexOf("."));

// hello.txt -> txt
// hello.dolly.txt -> txt
// hello -> undefined
// .hello -> hello

fetchFileExtention(fileName) {
    return fileName.slice((fileName.lastIndexOf(".") - 1 >>> 0) + 2);
}