有没有办法循环这个

Is there a way to loop this?

本文关键字：循环 有没有      更新时间：2023-12-09

是否有方法循环变量的声明？只是一个循环来帮助我声明变量，这样我就不必做改变变量编号的单调工作

	var height1 = document.getElementById('height1').value;
	var height2 = document.getElementById('height2').value;
	var height3 = document.getElementById('height3').value;
	var height4 = document.getElementById('height4').value;
	var height5 = document.getElementById('height5').value;
	var height6 = document.getElementById('height6').value;
	var height7 = document.getElementById('height7').value;
	var height8 = document.getElementById('height8').value;
	var height9 = document.getElementById('height9').value;
	var height10 = document.getElementById('height10').value;
	var height11 = document.getElementById('height11').value;
	var height12 = document.getElementById('height12').value;
	var height13 = document.getElementById('height13').value;
	var height14 = document.getElementById('height14').value;
	var height15 = document.getElementById('height15').value;
	var height16 = document.getElementById('height16').value;

这不是一种正确的编码方式，就像一样

var heights = [];
Array.from(document.querySelectorAll("input[id^=height]")).forEach(function(itm){
  heights.push(itm.value);
});

现在，您可以根据需要迭代数组heights来操作值。

代码背后的逻辑是，querySelectorAll("input[id^=height]")将选择id以文本height开头的输入元素。由于querySelectorAll的返回值是nodelist，所以在对其使用数组函数之前，我们必须将其转换为array。因此，我们使用Array.from(nodelist)。之后，我们使用forEach对返回的数组进行迭代，并将所有元素的值推送到数组heights中。

这几乎总是表示您想要一个数组。类似这样的东西：

var heights = [];
for (var i = 1; i <= 16; i++) {
    heights.push(document.getElementById('height' + i).value);
}

然后，您可以使用以下内容引用数组中的值：

heights[1]

尽管从技术上讲，因为在JavaScript中，您的窗口级变量是window对象的可索引属性，但您基本上可以对变量名本身执行相同的操作：

for (var i = 1; i <= 16; i++) {
    window['height' + i] = document.getElementById('height' + i).value;
}

然后你仍然可以使用你的原始变量：

height1

尽管为了将事情保持在窗口/全局范围之外，但维护数组似乎更干净（在语义上更明智）。

这似乎是一个很好的对象用例：

var heights = {};
for (var i = 1; i <= 16; i++) {
  heights[i] = document.getElementById('height' + i).value;
}

也许是时候引入function:了

一般来说，函数是一个"子程序"，可以由函数的外部代码（递归情况下为内部代码）调用。与程序本身一样，函数由一系列称为函数体的语句组成。值可以传递到函数，函数将返回值。

function getHeight(id) {
    return document.getElementById(id).value;
}

使用所需的id进行调用，并将其用作变量。

getHeight('height1')

通常你会把它们放在一个数组中。

var  heights = []
for (i = 1; i < 17; i++) { 
  heights[i] = document.getElementById('height' + i).value;;
}

小心，这会在数组的开头给你一个洞，即heights[0]中没有任何内容。如果你用它来迭代，那就无关紧要了。。。

for (var i in heights) {
  alert(heights[i]);
}
相关文章：