Javascript 将插入符号放置在contenteditable元素内的跨度元素内

我正在开发一个文本编辑器。我有一个可编辑的内容

，其中将放置带有实际样式属性的

元素。 现在，我知道如何在这些span元素中放置插入符号，但一旦我开始键入，文本将打印在span之外，div本身内部

以下是插入符号放置的相关代码：

var rs = $( "#textEntry" ).insert( "span" ).set( "style" , style );

            sel = window.getSelection();

            sel.collapse( rs[ 0 ] , 0 );

            rs[ 0 ].focus();

其中，

rs[0]

是当前的跨度元素

我怎样才能克服这种行为

---

另外，

$

不是一个jQuery。

玩了这个之后，解决方案似乎如下：

有必要添加一些内部文本，然后在元素的第一个子元素（文本节点）上设置插入符号，然后删除文本。插入符号将停留在该位置，瞧！它起作用了

var rs = $( "#textEntry" ).insert( "span" ).set( "style" , style ).html( "a" );

rs[ 0 ].focus();
if ( document.selection ) {
    sel = document.selection.createRange();
    sel.moveStart( 'character' , 0 );
    sel.select();
}
else{
    sel = window.getSelection();
    sel.collapse( rs[ 0 ].firstChild , 0 );
}

rs.html( "" , true );

我很高兴看到其他解决方案，伙计们