Javascript 为什么数组被向后写入？

我的html：

<div id="search" contenteditable="true"></div>

我的js：

var clrz = ['#ad13f6','#3f00d0','#00ff7e']

$('#search').bind('input', function() {

    var s = $('#search').text();
    var a = s.split('');
    for (var i = 0; i < a.length; i++) {
        var ran = Math.floor(Math.random()*3);
        var clr = clrz[ran];
        a[i] = '<span style="color:'+clr+';">' + a[i] +'</span>'
    };
    $('#search').html(a);

});

var clrz=['#ad13f6'，'#3f00d0'，'#00ff7e']
$（'#search'）.bind（'input'，function（）{
var s=$（“#搜索”）.text（）；
var a=s.分割（“”）；
对于（变量i=0；i

如果删除重写div的最后一行（$（'#search'）.html（a）），并将数组（a）记录到控制台，它会按顺序显示出来。但是，当我试图用.html（a）重写它时，结果却是相反的

这是一把小提琴：

---

想知道为什么吗？

每次击键并导致重写

#search

的内容时，插入光标都会被设置回div的开头，因此键入的每个新键都会位于div的开头

---

如果在键入每个键后按“结束”键，可以看到它避免了问题。如果您真的想重写正在键入的内容，那么您需要在重写数据之前保存光标位置，然后在重写数据之后恢复光标位置。

每次击键时，都会导致

\search

的内容被重写，插入光标被设置回div的开头，因此您键入的每个新键都位于div的开头

---

如果在键入每个键后按“结束”键，可以看到它避免了问题。如果确实要重写正在键入的内容，则需要在重写数据之前保存光标位置，然后在重写数据后恢复光标位置。

因为光标始终位于前端，所以每次键入字符时，它会添加到字符串的开头。它可能是b，因为您使用的是随机函数，因此每次顺序都可能更改。您能定义“顺序”和“向后”吗？可能的重复，因为光标始终保持在前面，所以每次键入字符时，它都会添加到字符串的开头。它可能是b，因为您使用的是随机函数，所以顺序每次都可能更改。你能定义“按顺序”和“向后”吗？thnx的可能复制品太多了！甚至没有注意到胡萝卜的位置&&thnx@Jack在contenteditable元素中移动胡萝卜将是我的下一个问题：）thnx太多了！甚至没有注意到胡萝卜的位置&thnx@Jack在contentedible元素中移动胡萝卜将是我的下一个问题：）