Javascript 将插入符号置于contenteditable中的图像之前/之后

我有一个聊天室。我添加了一个函数，用于将表情符号添加到文本中。 当我在contenteditable中单击表情符号时，我希望插入符号放在图像之前或之后

。聊天文本框img{
宽度：100%；
身高：100%；
}
.聊天室文本框表情符号{
宽度：18px；
高度：18px；
显示：内联块；
}

这是一个表情符号：

当文本框具有

:focus

关于伪元素的更多信息

。聊天文本框img{
宽度：100%；
身高：100%；
}
.聊天室文本框表情符号{
宽度：18px；
高度：18px；
显示：内联块；
/*添加此选项是为了在：：after上使用position:absolute*/
位置：相对位置；
}
.聊天室文本框：焦点表情符号：：之后{
内容：“>”；
显示：块；
宽度：1em；
高度：1公厘；
位置：绝对位置；
底部：0；
权利：-1.5雷姆；
}

这是一个表情符号：

@NeXuS很高兴我能帮忙：）