Cette fois, je vais vous présenter les précautions d'utilisation de JS pour créer une fonction de barre de progression animée. Ce qui suit est un cas pratique, jetons-y un œil.
1. Effet
2. Code source
<html>
<head>
<script type="text/javascript">
window.onload = function () {
var myProgress = document.getElementById("myProgress");
var mySpan = document.getElementById("mySpan");
var value = myProgress.value;
mySpan.innerText = value + "%";
var ID = setInterval(function () {
value = myProgress.value;
if (value < 100) {
value += 10;
myProgress.value = value;
mySpan.innerText = value + "%";
}
if (value == 100) {
clearInterval(ID);
}
}, 500);
}
</script>
</head>
<body>
<label for="myProgress">进度条</label>
<progress id="myProgress" value="0" max="100"></progress>
<span id="mySpan"></span>
</body>
</html>Je crois que vous maîtrisez la méthode après avoir lu le cas dans ce cas. article, plus excitant Veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !
Lecture recommandée :
Application de modules angulaires2 et partagés
Vue+Nuxt.js pour le rendu côté serveur
Ce 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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
