HTML | DOM 输入文件上传对象

DOM Input FileUpload 对象表示HTML 表单的输入类型，即“文件” 。这用于启用将文件上传到网站的用户端功能。

句法：

document.getElementById("ID")

“ID”将分配给输入元素。

属性值：

• accept：该属性用于设置或返回文件上传按钮的accept属性的值
• autofocus：此属性用于设置或返回文件上传按钮是否应在页面加载时自动获得焦点
• defaultValue：该属性用于设置或返回文件上传按钮的默认值
• disabled：该属性用于设置或返回文件上传按钮是否禁用
• files：此属性用于返回一个 FileList 对象，该对象表示使用文件上传按钮选择的一个或多个文件
• form：该属性用于返回对包含文件上传按钮的表单的引用
• multiple：该属性用于设置或返回是否允许用户在文件上传字段中选择多个文件
• name：该属性用于设置或返回文件上传按钮的name属性值
• required：该属性用于设置或返回在提交表单前是否必须选择文件上传字段中的文件
• type：该属性用于返回文件上传按钮是哪种类型的表单元素
• value：该属性用于返回所选文件的路径或名称

下面的示例显示了 FileUpload 的工作原理。
示例 1：通过 FileUpload 对象上传文件

  

    
      DOM Input FileUpload Object
  
    
        h1 {
            color: green;
        }
          
        h3 {
            font-family: Impact;
        }
          
        body {
            text-align: center;
        }
    

  

    
      GeeksforGeeks
  
    
      DOM Input FileUpload Object
  
  
    
    
  
  
    
      Click the "Upload" button 
      to disable the file upload button.
  
  
    
      Upload
  
  
    
        function myFunction() {
            
            var x = document.getElementById("myFile");
            x.disabled = true;
            
            var y = document.getElementById(
              "submit_text").innerHTML = 
                "Thank you For Submitting";
        }
    
  

  

  

  

输出：
前：

后：

示例 2：创建 元素 type=file。

  

    
        DOM Input FileUpload Object
    
    
        h1 {
            color: green;
        }
          
        h3 {
            font-family: Impact;
        }
          
        body {
            text-align: center;
        }
    

  

  
    
      GeeksforGeeks
  
    
      DOM Input FileUpload Object
  
  
    
      Create
  
    
    
        function myFunction() {
            
            var x = 
                document.createElement("INPUT");
            x.setAttribute("type", "file");
            document.body.appendChild(x);
        }
    
  

  

输出：
前：

后：

支持的浏览器：

• 谷歌浏览器
• 边缘
• 火狐浏览器
• 歌剧
• 苹果浏览器