使用JavaScript逐渐改变不透明度不会'；行不通

我有这个元素：

<div id="newDimention">
  <div class="newDimention">
  </div>
</div>  

setTimeout（（）=>{
setDimension（）；
newdimension.innerText=“您已经揭开了第三维。”
newdimension.style.color=“紫色”；
newdimension.style.fontSize='30px'；
newdimension.style.marginTop='30px'；
newdimension.style.opacity=“0”；
})
const setdimension=（）=>{
对于（var i=0，b=14；i{
//document.getElementById（“newDimension”）.style.opacity=String（Math.round（i/50）/10）；
newdimension.style.opacity=String（数学圆（i/50）/10）；
}，i*b）
}
}

我尝试不转换为字符串，尝试通过类进行访问，id。Devtools清楚地显示

string（Math.round（I/50）/10）

每次都会逐渐增加。但是

newdimension.style.opacity每次都保持
'0'

然后一旦
String（Math.round（i/50）/10）=='1'
，
newDimention.style.opacity
立即更改为
'1'
。因此，由于某种原因，它一直保持
'0'
，直到
i==500
，然后突然变为
'1'
。我没有任何其他函数操作这个元素。如果我删除行
newDimention.style.opacity=String（Math.round（I/50）/10）
不透明度保持在
'0'
，因此此行应更改此元素的不透明度

为什么会发生这种情况？
在写这个问题时，我意识到我在
for循环
中使用了
var
而不是
let
，因此当函数最终在
setTimeout
后被触发时，它们使用了
I==500
，即最新的值。将其更改为
让
修复它：

const setDimention = () => {
for (let i = 0,b=14; i <= 500; i++) {
 setTimeout(()=>{
//document.getElementById("newDimention").style.opacity=String(Math.round(i/50)/10);
   newDimention.style.opacity=String(Math.round(i/50)/10);
 },i*b)
}
}

const setdimension=（）=>{
对于（设i=0，b=14；i{
//document.getElementById（“newDimension”）.style.opacity=String（Math.round（i/50）/10）；
newdimension.style.opacity=String（数学圆（i/50）/10）；
}，i*b）
}
}

发件人：

“
let
允许您声明限制在块语句或其使用的表达式范围内的变量，这与var关键字不同，var关键字全局定义变量，或局部定义整个函数，而不考虑块范围”

setTimeout(()=>{
 setDimention();
  newDimention.innerText="You've uncovered the third dimension."
   newDimention.style.color="purple";
    newDimention.style.fontSize='30px';
    newDimention.style.marginTop='30px';
    newDimention.style.opacity="0";
    })



const setDimention = () => {
for (var i = 0,b=14; i <= 500; i++) {
 setTimeout(()=>{
//document.getElementById("newDimention").style.opacity=String(Math.round(i/50)/10);
   newDimention.style.opacity=String(Math.round(i/50)/10);
 },i*b)
}
}

const setDimention = () => {
for (let i = 0,b=14; i <= 500; i++) {
 setTimeout(()=>{
//document.getElementById("newDimention").style.opacity=String(Math.round(i/50)/10);
   newDimention.style.opacity=String(Math.round(i/50)/10);
 },i*b)
}
}