Knockout.js knockoutjs数据绑定的工作原理

请先查看代码，然后重试 这里是jsfiddle链接

html 我想知道knockoutjs数据绑定是如何工作的

当用户第一次单击按钮时，将在数组中推入一个元素并生成一个div，但当用户第二次单击按钮时，将再次在数组中推入一个元素，并生成一个div，而不是2。所以我的问题是为什么总是生成一个div

当我们点击按钮时，一个div被渲染，当第二次点击时，另一个div被渲染。所以，无论何时单击按钮，都会在页面中添加一个div，但假设当数组有5个元素时，页面中也会添加一个div

据我所知，

foreach循环

的迭代次数应与数组中元素的次数相同。但在knockoutjs

foreach

中，始终迭代一次，并在页面中添加或呈现单个div

若有人运行我的代码，那个么他们可以看到数组何时有5个元素，然后knockoutjsforeach只迭代一次，并在页面中添加一个新div

我对knockoutjs foreach如何在页面中添加html元素感到非常困惑

下面的代码如何工作以及如何在页面中添加div尚不清楚

<div id="dash" data-bind="foreach: rows">
    <div data-bind="text:$data"></div>
</div>

---

请帮助我理解。感谢

knockout foreach循环的迭代次数与数组中的元素数相同。可以这样想：它总是从一个空容器开始。（实际上，它会记住以前创建的元素，只创建缺少的元素。）感谢您的回复。你说

（事实上，它会记住以前创建的元素，只创建缺少的元素

你能把我引向任何一篇文章，描述与你在样例代码中所说的关于敲除数据绑定的内容相同的内容吗？谢谢。敲除是开源的。如果你想知道它是如何做的，请阅读源代码。敲除源代码代码将是巨大的。你能把我重定向到关于这个问题的任何相关文章吗？你能停止在这里写txtspeak吗？我们不是在聊天。我不想这么说，但我不会帮你做谷歌搜索。如果你想知道一个软件是如何工作的，请阅读源代码。如果你想知道如何使用它以及它的功能，请阅读文档或者是无数的博客帖子或答案中的一些。如果你有一个关于它的真正问题，在这里问它。“这个库是如何工作的？”不是一个真正的问题。

function TableModel() {
    var self = this;
    self.Counter=1;
    self.rows = ko.observableArray([]),
    self.addRow = function() {
        self.rows.push( self.Counter+' '+ new Date() );
        self.Counter++;
        setTimeout(function()
        { 
            self.rows.shift(); 
            self.Counter--;
        }, 3000 + self.rows().length*1000 );
    }
}
ko.applyBindings(new TableModel());

<div id="dash" data-bind="foreach: rows">
    <div data-bind="text:$data"></div>
</div>