Maison > Article > interface Web > Explication détaillée de l'utilisation de la balise de progression HTML
Explication détaillée de l'utilisation de la balise de progression HTML
- 黄舟original
- 2017-07-08 13:56:193705parcourir
La balise
progress
progress définit la progression (processus) d'une tâche en cours d'exécution.
Attributs
| Attribut | Valeur | Description | |||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| max td> | numéro | Spécifie la valeur maximale à compléter | |||||||||||||||
| valeur | numéro | Spécifie la valeur actuelle du processus | |||||||||||||||
position
|
float | Renvoie la position actuelle de progress barre |
|||||||||||||||
| étiquettes | - | Renvoie la liste des balises de la barre de progression (le cas échéant) |
max0.0~1.0Par défaut, la valeur de progression va de max=100, Si défini sur 0~100., la plage de valeurs de progression est de
valuemax=100 spécifie la valeur actuelle. , la progression est exactement de moitié.value=50La présence ou l'absence de l'attribut détermine si la value barre de progression a un progressdéterminisme Lorsqu'il n'y a pas de , la barre de progression du navigateur bouclera à l'infini, mais une fois que l'attribut value est présent (même s'il n'a aucune valeur), il est également considéré comme certain. value
est un attribut en lecture seule, qui reflète la progression actuelle. position, qui est la valeur de value/max. position
est également un attribut en lecture seule, et ce que vous obtenez, ce sont les éléments d'étiquette pointant vers l'élément labels. progress
<!DOCTYPE html>
<html>
<head>
<title>progress</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript">
function myFunction()
{
var x=document.createElement("PROGRESS");
x.setAttribute("value","80");
x.setAttribute("max","100");
document.body.appendChild(x);
}
</script>
<body>
创建PROGRESS:
<button onclick="myFunction()" id="myprogress">创建</button>
</body>
</html>4. Utiliser l'attribut Position <!DOCTYPE html>
<html>
<head>
<title>progress</title>
<meta charset="utf-8">
</head>
<body>
<script>
function myFunction()
{
var x = document.getElementById("myProgress").position;
document.getElementById("demo").innerHTML = x;
}
</script>
<body>
<p>下载进度条:</p>
<progress id="myProgress" value="50" max="100"></progress>
<p id="demo"></p>
<button onclick="myFunction()">获取进度值</button>
</body>
</html>Contrôle du style, compatibilité et exemples d'éléments de progression HTML5Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!