实现效果：

超文本标记语言代码：

！DOCTYPE html html head meta charset=' UTF-8 '标题表格编辑器/title link rel='样式表type=' text/CSS ' href=' CSS/table write。CSS ' rel='外部“no follow ”/脚本src=' http : js/tablewrite。js ' type=' text/JAVAScript ' charset=' utf-8 '/脚本/头体氕表格编辑器/h1节表id='myTable' tbody tr th用户名/th地址/th电话汤姆/道明济南TD/TD/12232341大时代TD/TD/213231312/TD/tr/t正文/表格/章节/正文/HTMlCSS代码：

*{ font: 12px/25px宋体；}h1{ font: 15px/25px宋体；}table，th，TD { border-collapse : collapse；border: 1px固体# cccccc}JS代码

函数tableBlurOperator(事件){ //获取事件的值让TD值=事件。目标。价值；//给事件的父类标签赋值事件。目标。ParentElement。值=TD值；}函数tableClickOperator(事件){//建立一个文本输入框让输入=文档。创建元素(“输入”)；input.type=' text//输入框的初始值为原标签上的值输入。值=事件。目标。innerhtml//将原标签的值清空，防止出现两次事件。目标。innerHTMl=//将文本输入框加入到表格中event.target.appendChild(输入);//在最后获得焦点输入。焦点()；//失去焦点的事件input.addEventListener('blur '，tableBlurOperator，false)；}函数init(){//点击事件文件。getelementbyid('我的表').addEventListener('click '，tableClickOperator，false)；} window.addEventListener('load '，init，false)；以上这篇使用Java脚本语言实现表格编辑器（实例讲解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。