Javascript setInterval可以工作，但不能无限循环
我不明白为什么无限循环不起作用，但取消对函数调用的注释却起作用Javascript setInterval可以工作，但不能无限循环,javascript,html,dom,setinterval,Javascript,Html,Dom,Setinterval,我不明白为什么无限循环不起作用，但取消对函数调用的注释却起作用 <body> <canvas id="myCanvas"style="border:2px solid black;" width="1600" height="900"> Your browser does not support the HTML5 canvas tag. </canvas> <script> var c = document.getElementB
<body>
<canvas id="myCanvas"style="border:2px solid black;" width="1600" height="900">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script>
var c = document.getElementById ("myCanvas").getContext ("2d");
var boxSize = 25;
var numBoxes = 1;
var x = 1000;
var dx = 1;
var y = 100;
var dy = 1;
var a = 0.01;
var da = 0.1;
var size = 20;
var w = c.canvas.width;
var h = c.canvas.height;
//function testing () {
while (true) {
c.clearRect (0, 0, w, h);
x = x + 1;
y = y + 1;
a = a + 0.1;
x = x + dx;
y = y + dy;
if (x < size / 2 || x + (size / 2) > w) {
dx = -dx;
da = -da;
}
if (y < size / 2 || y + (size / 2) > h) {
dy = -dy;
da = -da;
}
c.save ();
c.translate (x, y);
c.rotate (a);
c.strokeRect (-size / 2, -size / 2, size, size);
c.restore ();
}
// testing ();
// setInterval (testing, 10);
</script>
</body>
您的浏览器不支持HTML5画布标记。
var c=document.getElementById（“myCanvas”）.getContext（“2d”）；
var-boxSize=25；
var-numBoxes=1；
var x=1000；
var-dx=1；
变量y=100；
var-dy=1；
var a=0.01；
var-da=0.1；
变量大小=20；
var w=c.canvas.width；
var h=c.画布高度；
//功能测试（）{
while（true）{
c、 clearRect（0，0，w，h）；
x=x+1；
y=y+1；
a=a+0.1；
x=x+dx；
y=y+dy；
如果（xw）{
dx=-dx；
da=-da；
}
如果（yh）{
dy=-dy；
da=-da；
}
c、 保存（）；
c、 翻译（x，y）；
c、 轮换（a）；
c、 strokeRect（-size/2，-size/2，size，size）；
c、 恢复（）；
}
//测试（）；
//设定间隔（测试，10）；
setInterval当您使用无限循环时，浏览器永远不会到达函数的末尾，因此它永远不会运行重新绘制，文档中的图像也永远不会更新。当您使用
setInterval当您使用无限循环时，浏览器永远不会到达函数的末尾，因此它永远不会运行重新绘制，文档中的图像也永远不会更新。JavaScript-in-a-browser是更大结构的一部分。您需要与此结构的规则保持一致，而不要伤害它。其中一个规则是您的JavaScript必须快速运行，然后退出。退出意味着控件返回框架，框架完成所有工作，重新绘制屏幕等 多次尝试隐藏和显示某些内容：
for (n = 0; n < 200; n++) {
$("#test").hide();
$("#test").show();
}
{
$（“#测试”）.hide（）；
$（“#测试”）.show（）；
}
不得不说，以这种方式组织代码并不容易，如果你想在画布上画出漂亮的动画，你必须马上完成。浏览器中的JavaScript是一个更大结构的一部分。你需要与这个结构的规则保持一致，而不要伤害它。其中一个规则是你的JavaScript必须快速运行退出意味着控件返回框架，框架完成所有工作，重新绘制屏幕等 多次尝试隐藏和显示某些内容：
for (n = 0; n < 200; n++) {
$("#test").hide();
$("#test").show();
}
{
$（“#测试”）.hide（）；
$（“#测试”）.show（）；
}
不得不说，以这种方式组织代码并不容易，如果你想在画布上画出漂亮的动画，你必须不用while来完成。
while（true）while（true）