如何一一显示JavaScript的innerHTML值
[英]How to display innerHTML values one by one javascript
问题描述
尝试显示我的内部HTML的值，从10到1，但只能显示值1。
值应该一个接一个地显示。例如，如果10个get显示，它将隐藏，然后9个显示，就像一个计时器一样。
如何解决此问题，这是我尝试过的方法。
HTML：
<div id='test'></div>
JS：
var a = 10;
var b=1;
var tar = document.getElementById('test');
for(var a=10;a>=b;a--){
tar.innerHTML = a;
if(a==b){
tar.innerHTML = a;
//tar.style.display='none';
window.location.href = "http://www.google.co.in";
}
}
4 个解决方案
解决方案1
1 2014-08-28 07:18:34
您遇到的问题是JavaScript的执行速度非常快，因此计数速度比您看到的快10到1。 您需要使用计时器将其放慢一点...
在此示例中，每个数字之间存在一秒钟的延迟。
var a = 10;
var b = 1;
var tar = document.getElementById('test');
var timer;
function countDown() {
tar.innerHTML = a;
if(a === b) {
tar.innerHTML = a;
//tar.style.display = 'none';
window.location.href = "http://www.google.co.in";
} else {
a--;
timer = window.setTimeout(countDown, 1000);
}
}
countDown();
解决方案2
0 2014-08-28 07:20:28
<html>
<head>
<script>
var myVar = setInterval(function(){myTimer()}, 1000);
var i=10;
function myTimer() {
i--;
if(i==1)
clearInterval(myVar);
document.getElementById("test").innerHTML = i;
}
</script>
</head>
<body>
<div id="test"></div>
</body>
</html>
解决方案3
0 2014-08-28 07:21:31
您可以简单地执行以下操作：
var counter = 10; // number of iterations
var tar = document.getElementById('test');
var interval = setInterval(function(){
if (counter === 0) clearInterval(interval); // skip if reached end
tar.innerHTML = counter; // update html
counter--; // update counter value
}, 1000) // 1000 = 1 second
见小提琴
解决方案4
0 2014-08-28 07:23:22
http://jsfiddle.net/0sbu5f8c/13/
var a = 10;
var b = 1;
var tar = document.getElementById('test');
var timer = setInterval(function () {
tar.innerHTML = a;
if(a === b) {
window.clearInterval(timer);
//window.location.href = "http://www.google.co.in";
}
a -= 1;
}, 500);
如何以字母显示日期 - Javascript --> innerhtml？
[英]How to display the date in letters - Javascript --> innerhtml?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.