如何使用 JavaScript 设置/获取 Progress Bar 的值？

在本文中，我们将使用 标签创建任务的进度条。 标签用于表示任务的进度。它还定义了完成了多少工作以及还剩下多少来下载一个东西。它不用于表示磁盘空间或相关查询。

HTML DOM 中的progress 对象用于表示HTML 元素。可以使用 getElementById() 方法访问 元素。

属性值：

• level：返回进度条列表。
• max：用于设置或返回max属性的进度条值。
• value：表示已经完成的工作量。
• position：它返回进度条的当前位置。

例子：

HTML

  

    
        How to set and get the value of
        Progress Bar using JavaScript ?
    

  

    
        GeeksforGeeks
    
  
    
        Set and Get the value of Progress
        Bar using JavaScript
    
  
    
        Downloading progress for a song:
    
  
  
    
        Submit
    
  
    
        function myGeeks() {
  
            // Create a progress element
            var g = document.createElement("progress");
  
            // Set the value of progress element
            g.setAttribute("value", "57");
  
            // Set the maximum value of progress element
            g.setAttribute("max", "100");
  
            // Get the value of progress element
            document.getElementById("GFG").appendChild(g);
        } 
    

  

输出：

点击按钮前：

点击按钮后：

支持的浏览器：

• 谷歌浏览器
• IE浏览器
• 火狐
• 歌剧
• 苹果浏览器