自建兼容IE/FF的轻量级在线文本编辑器
135 浏览量
更新于2024-08-30
收藏 73KB PDF 举报
本文档分享了一位开发者在经历疲惫后，仍然坚持完成了一个自己编写的在线文本编辑器项目，这个编辑器旨在模仿ewebeditor的功能，尽管不如ewebeditor强大，但它实现了基本编辑功能，并且特别强调了对IE和Firefox浏览器的兼容性。开发过程中，作者花费了大量精力，以确保跨浏览器的一致性。
文章的核心内容围绕着如何构建一个兼容多种浏览器的文本编辑器，首先从HTML结构开始，使用<!DOCTYPE html>声明文档类型，并引入XHTML 1.0 Transitional DTD，确保遵循标准。`<head>`部分包含了`<meta>`标签，设置了页面的字符编码为UTF-8，这对于处理各种字符集至关重要。
接下来，作者引入了两个JavaScript文件——"core.js"和"advance.js"，这可能是编辑器的核心逻辑和扩展功能模块。这些脚本可能包含事件处理、用户界面交互以及编辑器的编辑、格式化、保存等功能。
在页面主体部分，一个带有边框的800x500像素表格被用来作为编辑区域，内部包含一个下拉菜单，用于选择不同的字体，体现了文本编辑器的基本功能之一。开发者还可能添加了字体大小调整、颜色选择、段落样式等编辑选项，以及可能的按钮来触发不同操作。
为了实现跨浏览器兼容，作者可能采用了条件注释或者polyfill技术，确保在IE和Firefox这样的不同浏览器环境下，核心功能能够正常工作。考虑到ewebeditor的兼容性是其亮点，可以推测这个自定义编辑器也做了相应的兼容性优化，例如处理IE的特定CSS特性或JavaScript行为。
这篇文档提供了创建一个简单但实用的在线文本编辑器的初步框架，尤其注重浏览器兼容性，对于希望学习HTML、CSS、JavaScript以及跨浏览器开发的读者来说，是一个有价值的实践案例。
自己写的兼容自己写的兼容ie和和ff的在线文本编辑器类似的在线文本编辑器类似ewebeditor
怎么说呢，刚包完夜吧，应该很累了，但现在仍有力气敲打着这些字符，看来我还没有到此为止啊。
废话少说，最近写了个在线的编辑器，类似ewebeditor那样的，当然没有人家那么强大，但是基本功能都有，而且还是兼容ie
和ff的，为此我也花了不少功夫，还是赶紧把代码祭出来吧
demo.html：
代码如下:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
</head>
<body>
<script src=”core.js”></script>
<script src=”advance.js”></script>
<table border=”0″ width=”800″ height=”500″ bgcolor=”gray”>
<tr height=”50″><td>
字体：<select onchange=”FontName(this.options[this.selectedIndex].value)”>
<option value=”宋体”>宋体
<option value=”黑体”>黑体
<option value=”楷体_GB2312″>楷体
<option value=”仿宋_GB2312″>仿宋
<option value=”隶书”>隶书
<option value=”幼圆”>幼圆
<option value=”新宋体”>新宋体
<option value=”细明体”>细明体
<option value=”Arial”>Arial
<option value=”Arial Black”>Arial Black
<option value=”Arial Narrow”>Arial Narrow
<option value=”Bradley Hand ITC”>Bradley Hand ITC
<option value=”Brush Script MT”>Brush Script MT
<option value=”Century Gothic”>Century Gothic
<option value=”Comic Sans MS”>Comic Sans MS
<option value=”Courier”>Courier
<option value=”Courier New”>Courier New
<option value=”MS Sans Serif”>MS Sans Serif
<option value=”Script”>Script
<option value=”System”>System
<option value=”Times New Roman”>Times New Roman
<option value=”Viner Hand ITC”>Viner Hand ITC
<option value=”Verdana”>Verdana
<option value=”Wide Latin”>Wide Latin
<option value=”Wingdings”>Wingdings</option>
</select>
字号：<select onchange=”FontSize(this.options[this.selectedIndex].value)”>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>
<option value=”4″>4</option>
<option value=”5″>5</option>
<option value=”6″>6</option>
<option value=”7″>7</option>
</select>
<button onclick=”color()”>颜色</button>
<button onclick=”bold()”>加粗</button>
<button onclick=”italic()”>倾斜</button>
<button onclick=”left()”>居左</button>
<button onclick=”center()”>居中</button>
<button onclick=”right()”>居右</button>
</td></tr>
<tr height=”50″><td>
<button>插入影视和图片</button>
<button>上传文件</button>
<button onclick=”inserttable()”>插入表格</button>
<button onclick=”inserthr()”>插入水平线</button>
<button onclick=”insertlink()”>插入超链接</button>
下载后可阅读完整内容，剩余9页未读，立即下载
2010-06-24 上传
2008-06-24 上传
2008-03-05 上传
2010-12-03 上传
2010-12-28 上传
2008-05-13 上传
2009-05-22 上传
2016-01-20 上传
2008-09-17 上传
weixin_38655347
- 粉丝: 9
- 资源: 919
我的内容管理
展开
最新资源
- 新代数控API接口实现CNC数据采集技术解析
- Java版Window任务管理器的设计与实现
- 响应式网页模板及前端源码合集：HTML、CSS、JS与H5
- 可爱贪吃蛇动画特效的Canvas实现教程
- 微信小程序婚礼邀请函教程
- SOCR UCLA WebGis修改：整合世界银行数据
- BUPT计网课程设计：实现具有中继转发功能的DNS服务器
- C# Winform记事本工具开发教程与功能介绍
- 移动端自适应H5网页模板与前端源码包
- Logadm日志管理工具：创建与删除日志条目的详细指南
- 双日记微信小程序开源项目-百度地图集成
- ThreeJS天空盒素材集锦 35+ 优质效果
- 百度地图Java源码深度解析：GoogleDapper中文翻译与应用
- Linux系统调查工具：BashScripts脚本集合
- Kubernetes v1.20 完整二进制安装指南与脚本
- 百度地图开发java源码-KSYMediaPlayerKit_Android库更新与使用说明
