如何使用 JavaScript 获取文件扩展名？

要使用 JavaScript 获取文件扩展名，有很多方法。最有用的是：
• split() 和 pop() 方法
• substring() 和 lastIndexOf() 方法
• 带有正则表达式的 match() 方法

  下面结合适当的例子对上述方法进行一一说明。

  • 使用 split() 和 pop() 方法：

    首先通过选择文件输入并获取其值属性来获得完整的文件名。这会将文件名作为字符串返回。

    在 split() 方法的帮助下，我们将文件名分成两部分。第一部分是文件名，第二部分是文件的扩展名。

    然后可以通过使用 pop() 方法从数组中弹出最后一个字符串来获得扩展名。因此，这是所选文件的文件扩展名。

    句法：

    fileName.split(separator, limit).pop();

    例子：

      
    
        How to get file extensions using JavaScript? 
    
      
    
        GeeksforGeeks
        Here we will get "Extension" of selected file
        Select a file and click on the button 
           to check the file extension.
        
            
            
        
        The file extension is: 
        
            function checkFileExtension() {
                fileName = document.querySelector('#file1').value;
                extension = fileName.split('.').pop();
                document.querySelector('.output')
                                         .textContent = extension;
            };
        
    
      

    输出：

    

  • 使用 substring() 和 lastIndexOf() 方法：
    在使用 substring() 方法返回开始和结束索引之间的字符串部分之后，首先获得完整的文件名。

    起始索引是通过使用 lastIndexOf() 方法给出的。这将返回字符串字符串的索引。可以通过将句点 (.) 传递给此方法来找到最后一个索引。索引被传递给 substring() 方法，该方法返回从句点 (.) 到结尾的字符串。这是文件扩展名。

    句法：

    fileName.substring(fileName.lastIndexOf(searchvalue, start);

    例子：

      
    
        How to get file extensions using JavaScript? 
    
      
    
        GeeksforGeeks
        Here we will get "Extension" of selected file
        Select a file and click on the button
            to check the file extension.
        
            
            
        
        The file extension is: 
        
            function checkFileExtension() {
                fileName = document.querySelector('#file1').value;
                extension = fileName.substring(fileName.lastIndexOf('.') + 1);
                document.querySelector('.output')
                                        .textContent = extension;
            };
        
    
      

    输出：

    

  • 带有正则表达式的 match() 方法：

    正则表达式可用于从完整文件名中提取文件扩展名。使用正则表达式“[^.]+$”创建一个新的 RegExp 对象。插入符号(^) 标记字符串的开始。插入符号后的句点 (.) 指定在句点后选择字符串。 plus(+) 量词选择一个或多个单词。美元 ($) 用于指定行尾。此表达式选择句点之后的字符串。

    match() 方法用于返回与作为参数传递给它的正则表达式匹配的字符串部分。完整的文件名被传递给这个方法，正则表达式只返回文件扩展名。

    句法：

    fileName = document.querySelector('#file1').value;
    regex = new RegExp('[^.]+$');
    extension = fileName.match(regex);
    

    例子：

      
    
        How to get file extensions using JavaScript? 
    
      
    
        GeeksforGeeks
        Here we will get "Extension" of selected file
        Select a file and click on the button 
             to check the file extension.
        
            
            
        
        The file extension is: 
        
            function checkFileExtension() {
                fileName = document.querySelector('#file1').value;
      
                regex = new RegExp('[^.]+$');
      
                extension = fileName.match(regex);
                document.querySelector('.output')
                                         .textContent = extension;
            };
        
    
      

    输出：