gpt4 book ai didi

javascript - 使用 div 的在线所见即所得编辑器

转载 作者:行者123 更新时间:2023-11-28 02:13:29 26 4
gpt4 key购买 nike

<分区>

我正在尝试使用 div 创建一个 WYSIWYG 编辑器,就像 Google Docs 的工作方式一样(据我所知)。我知道编辑器还有其他更简单的解决方案,但它们都有一个共同点:由于 Javascript execCommand() 函数,它们输出糟糕的 HTML。我真的需要它来输出干净的 HTML(以及跨浏览器的相同 HTML),因此我正在考虑用常规 div 和一些 Javascript 编写我自己的编辑器(记录点击和按键等)在我这样做之前,我有几个问题:

  • 我正在寻找的编辑器(在浏览器中输出相同、干净的 HTML 的编辑器)是否已经存在?
  • 我是否误会了可以这样写?

非常感谢!

编辑:我想我应该更清楚这一点:我不认为现有的 WYSIWYG 编辑器(如 TinyMCE 或 CKEditor)是一个选项,因为(如果我错了请纠正我)他们使用 Javascript execCommand( ) 功能。这(特别是在设计模式下与 iFrame 结合使用,它们都使用)在不同的浏览器中输出不同的、不合逻辑的 HTML。例如:在 Safari 中一个简单的输入会导致它创建一个 div,而不是添加一个 <br />。标记或创建一个新段落 ( <p> )。此外:将文本加粗会导致 Mozilla 添加 <span style="font-weight: bold"> , Internet Explorer 和 Opera 添加 <strong>和 Safari 添加 <b>标签。更不用说一些浏览器通过将它们的名称添加到标签中的技巧(Safari 我正在看着你,我不喜欢 <span class="Apple-style-span"> )。因为没有办法改变所有这些奇怪的行为,所以我很难让网站看起来一致。

这就是我考虑编写自己的替代方案的原因:跨浏览器的兼容性和一致性......

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com