JavaScript简单表格编辑功能实现方法


Posted in Javascript onApril 16, 2015

本文实例讲述了JavaScript简单表格编辑功能实现方法。分享给大家供大家参考。具体如下:

<html>
<head>
<script type="text/javascript">
function getInnerHTML()
{
alert(document.getElementById("tr2").innerHTML);
}
 
function insCell()
{
 var x=document.getElementById('tr2').insertCell(0)
 x.innerHTML="Table Row, Table Cell"
}
 
function delCell()
{
 document.getElementById('tr2').deleteCell(0)
}
 
function deleteCaption()
{
 document.getElementById('myTable').deleteCaption()
}
 
function createCaption()
{
var x=document.getElementById('myTable').createCaption()
x.innerHTML="My Table"
}
 
function delRow()
{
document.getElementById('myTable').deleteRow(0)
}
 
function insRow()
{
var x=document.getElementById('myTable').insertRow(0);
var y=x.insertCell(0);
var z=x.insertCell(1);
y.innerHTML="New Cell 1";
z.innerHTML="New Cell 2";
}
</script>
</head>
<body>
<center><table id="myTable" border="1">
<tr id="tr2">
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr id="tr2">
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tr id="tr2">
<td>Row3 cell1</td>
<td>Row3 cell2</td>
</tr>
</table>
<br />
<center>
<table border="0">
<tr><th colspan="2">Table Controler</th></tr>
<tr><td>
<center>
<input type="button" onclick="createCaption()" 
value="Create caption"></td><td>
<center>
<input type="button" onclick="deleteCaption()"
value="Delete caption" />
</td></tr>
<tr><td colspan="2">
<center>
<input type="button" onclick="getInnerHTML()"
value="Alert innerHTML of table row" />
</td></tr>
<tr><td>
<center>
<input type="button" onclick="insRow()" 
value="Insert row">
</td><td>
<center>
<input type="button" onclick="delRow()"
value="Delete first row">
</td></tr>
<tr><td>
<center>
<input type="button" onclick="insCell()" 
value="Insert cell">
</td><td>
<center>
<input type="button" onclick="delCell()" 
value="Delete cell">
</td></tr>
</table>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
jQuery操作checkbox选择(list/table)
Apr 07 Javascript
js中取得变量绝对值的方法
Jan 03 Javascript
js实现同一个页面多个渐变效果的方法
Apr 10 Javascript
cocos2dx骨骼动画Armature源码剖析(一)
Sep 08 Javascript
JavaScript 数组中最大最小值
Jun 05 Javascript
AngularJS之页面跳转Route实例代码
Mar 10 Javascript
AngularJS 最常用的八种功能(基础知识)
Jun 26 Javascript
用vue的双向绑定简单实现一个todo-list的示例代码
Aug 03 Javascript
node.js学习之断言assert的使用示例
Sep 28 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
Jun 10 Javascript
angularJs自定义过滤器实现手机号信息隐藏的方法
Oct 08 Javascript
node.js 基于cheerio的爬虫工具的实现(需要登录权限的爬虫工具)
Apr 10 Javascript
JavaScript转换二进制编码为ASCII码的方法
Apr 16 #Javascript
JavaScript实现彩虹文字效果的方法
Apr 16 #Javascript
JavaScript监听文本框回车事件并过滤文本框空格的方法
Apr 16 #Javascript
JQuery跳出each循环的方法
Apr 16 #Javascript
jQuery $.each遍历对象、数组用法实例
Apr 16 #Javascript
jQuery Ajax中的事件详细介绍
Apr 16 #Javascript
JavaScript实现页面5秒后自动跳转的方法
Apr 16 #Javascript
You might like
php XMLWriter类的简单示例代码(RSS输出)
2011/09/30 PHP
PHP文章采集URL补全函数(FormatUrl)
2012/08/02 PHP
php数组添加元素方法小结
2014/12/20 PHP
php实现根据身份证获取精准年龄
2020/02/26 PHP
Maps Javascript
2007/01/22 Javascript
JavaScript 以对象为索引的关联数组
2010/05/19 Javascript
javascript 基础篇2 数据类型,语句,函数
2012/03/14 Javascript
浅析ajax请求json数据并用js解析(示例分析)
2013/07/13 Javascript
利用js判断浏览器类型(是否为IE,Firefox,Opera浏览器)
2013/11/22 Javascript
Javascript 拖拽的一些高级的应用(逐行分析代码,让你轻松了拖拽的原理)
2015/01/23 Javascript
使用vue编写一个点击数字计时小游戏
2016/08/31 Javascript
Vue.js每天必学之表单控件绑定
2016/09/05 Javascript
AngularJS过滤器filter用法实例分析
2016/11/04 Javascript
基于jQuery制作小图标上下滑动特效
2017/01/18 Javascript
bootstrap弹出层的多种触发方式
2017/05/10 Javascript
用JavaScript做简易的购物车的代码示例
2017/10/20 Javascript
深入理解Vue 的钩子函数
2018/09/05 Javascript
vue如何根据网站路由判断页面主题色详解
2018/11/02 Javascript
微信小程序设置全局请求URL及封装wx.request请求操作示例
2019/04/02 Javascript
python共享引用(多个变量引用)示例代码
2013/12/04 Python
Python闭包实现计数器的方法
2015/05/05 Python
pycharm中连接mysql数据库的步骤详解
2017/05/02 Python
python添加模块搜索路径方法
2017/09/11 Python
python实现全盘扫描搜索功能的方法
2019/02/14 Python
Python实现的爬取百度贴吧图片功能完整示例
2019/05/10 Python
使用python3调用wxpy模块监控linux日志并定时发送消息给群组或好友
2019/06/05 Python
python 猴子补丁(monkey patch)
2019/06/26 Python
让Python脚本暂停执行的几种方法(小结)
2019/07/11 Python
python爬取Ajax动态加载网页过程解析
2019/09/05 Python
Tensorflow不支持AVX2指令集的解决方法
2020/02/03 Python
对Tensorflow中Device实例的生成和管理详解
2020/02/04 Python
python字符串常用方法及文件简单读写的操作方法
2020/03/04 Python
python+selenium爬取微博热搜存入Mysql的实现方法
2021/01/27 Python
电脑售后服务承诺书
2014/03/27 职场文书
小学生2014国庆节演讲稿:祖国在我心中
2014/09/21 职场文书
Nginx配置使用详解
2022/07/07 Servers