Javascript 删除contenteditable div的内容，添加奇怪的字体元素

我对contenteditable div有问题

div以一个带有样式的span开头，但当我删除内容并写入时，会出现一种新元素字体，字体相同，但大小转换为24到5

有什么问题？如何设置跨度

我举一个例子，当你从可编辑的内容中删除所有内容并写入时，请查看控制台日志

你好

附言。

---

对不起，我的学校英语不好，谢谢大家

您可以简单地将字体属性设置为span的父元素（在您的示例中为#test）。 如果这样做，您也不必在span中指定字体属性；它们将被简单地继承。 所以只要在你的小提琴中改变这个CSS规则就行了

#test{width:300px; height:200px; background-color:black; color:white;}

到

如果您只想针对#test div中的特定子元素，可以添加这样的CSS行：

#test span {font-family:Arial;font-size:24px;}

---

编辑：出现问题的原因：删除“Hello！！！”时从#test中，跨度也被删除，删除所有字体样式。这就是为什么你必须对字体样式进行测试。我重新编辑了小提琴，你会看到每次鼠标移出测试时，你的字体大小都保持不变；而且#test没有子元素

编辑了我的答案，希望这是您在寻找的Hanks，但我无法在div父级上设置样式。我知道跨度已被删除，但为什么只有chrome添加不推荐的字体元素，而不是仅添加文本？？？我能解决这个问题吗？一个快速的谷歌搜索显示这是谷歌浏览器中的一个bug。无论如何，标签都是不推荐的，所以这有点奇怪。我上一次对JSFIDLE进行了完全有效的更新，css只应用于span。当#test为空时，标记不会出现，#test div返回未定义的字体大小。谢谢，这是CRACY，Safari上也有同样的问题，WEBKit就是问题所在，我在我的项目中尝试了这个解决方案，希望能解决这个问题！

#test{width:300px; height:200px; background-color:black; color:white; font-family:Arial;font-size:24px;}

#test span {font-family:Arial;font-size:24px;}