JavaScript如何使用数组实时更新DOM

JavaScript how to realtime update the DOM by using an Array?

本文关键字:实时更新 DOM 数组 何使用 JavaScript      更新时间:2023-09-26

我不确定KnockOut是否可以做到这一点,但我想要的是使用纯JavaScript变量(假设是'Array')作为DOM元素(假设是'UL')的源。

当我更新Array条目时,我希望'UL'以实时方式反映出来。当然:

  • 我不想使用定时器之类的东西
  • 我只想使用纯JavaScript数组。(不是Angular对象或其他)

这可能吗?

不使用array。Push来更新你的数组,写一个setter来同时更新数组和列表。

var list = document.querySelector('#myList'),
    model = [],
    update = function update(value) {
        var item = document.createElement('li');
        model.push(value);
        item.textContent = value;
        list.appendChild(item);
    };