Javascript jQuery：记录数组中的元素更改，并通过其索引检查它的状态

每次单击都是一个步骤，将在

中添加一个子div。test

，我将所有元素更改保留在

步骤

数组中

我希望它看起来像这样：

Array step [0]        = before click, 
Array step [0,01]     = after one click, 
Array step [0,01,012] = aftert two click

Array step [0]        = before click, 
Array step [0,11]     = after one click, 
Array step [0,11,222] = aftert two click

但它是这样工作的：

Array step [0]        = before click, 
Array step [0,01]     = after one click, 
Array step [0,01,012] = aftert two click

Array step [0]        = before click, 
Array step [0,11]     = after one click, 
Array step [0,11,222] = aftert two click

HTML:

计数子元素

javascript:

var step =[];               // step is a record of changes in #test.
step.push($('.test'))        //step[0] is status of .test at very beginning.
$('#result').append(step[0][0].childElementCount+"<br>") // #result showing how many child element in #test
        var change = function (){          
        $('.test').append('<div>t</div>')       //every click will a append <div> in #test
        step.push($('.test'))                    // record this move in step[] 
        console.log('step length',step.length)   // total moves
        for ( var i = 0; i < step.length; i++ ) {
        $('#result').append(step[i][0].childElementCount)
        }
        $('#result').append("<br>")}

var步骤=[]；//步骤是#测试中更改的记录。
step.push（$（'.test'））//步骤[0]在最开始时是.test的状态。
$（“#结果”）。追加（步骤[0][0]。childElementCount+“
”/#结果显示#测试中有多少子元素
var change=函数（）{
$（'.test'）.append（'t'）//每次单击都会在#test中添加一个append
step.push（$（'.test'）//在步骤[]中记录此移动
console.log（'step length'，step.length）//移动总数
对于（变量i=0；i”）

非常感谢您事先提供的帮助。

您的循环迭代（

i

）应该基于

childElementCount

而不是

步长

数组长度

我用

步长[step.length-1]

更改了您的代码以获取数组中的最后一个元素，并将for循环更改为在命中最后一个

childElementCount

时停止。我还显式地调用了

change（）

，让它为您创建和呈现第一个元素，以避免重复代码

固定小提琴：

固定代码：

var步骤=[]；//步骤是#测试中更改的记录。
函数更改（）{
$（“#test”）.append（'t'）//每次单击都会在#test中添加一个append
step.push（$（'#test'）//在步骤[]中记录此移动
console.log（'step length'，step.length）//移动总数
对于（var i=0；i）
}
change（）；//让更改为您完成工作

计数子元素