body onload()事件和table insertRow()、tr insertCell()
onload事件:
定义和用法:
onload 事件会在页面或图像加载完成后立即发生。
onload 通常用于 <body> 元素,在页面完全载入后(包括图片、css文件等等。)执行脚本代码。
语法:
在HTML中:<body onload="SomeJavaScriptCode">
在JavaScropt中:window.onload=function(){SomeJavaScriptCode};
SomeJavaScriptCode必需。规定该事件发生时执行的 JavaScript。(执行代码)
实例:<body onload="myFunction()">
table insertRow()函数方法
定义和用法:insertRow() 方法用于在表格中的指定位置插入一个新行。
语法:tableObject.insertRow(index);index:指定插入新行的位置 (以 0 开始)。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function displayResult(){
var table=document.getElementById("myTable");
var row=table.insertRow(0);
var cell1=row.insertCell(0);
var cell2=row.insertCell(1);
cell1.innerHTML="New";
cell2.innerHTML="New";
}
</script>
</head>
<body> <table id="myTable" border="1">
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">插入新行</button> </body>
</html>
tr insertCell()函数方法
定义和用法:insertCell() 方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。
语法:trObject.insertCell(index);index:该方法将创建一个新的 <td> 元素,把它插入行中指定的位置。新单元格将被插入当前位于 index 指定位置的表元之前。如果 index 等于行中的单元格数,则新单元格被附加在行的末尾。
实例:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function displayResult(){
var firstRow=document.getElementById("myTable").rows[0];
var x=firstRow.insertCell(-1);
x.innerHTML="New cell"
}
</script>
</head>
<body> <table id="myTable" border="1">
<tr>
<td>First cell</td>
<td>Second cell</td>
<td>Third cell</td>
</tr>
</table>
<br>
<button type="button" onclick="displayResult()">插入单元格</button> </body>
</html>
body onload()事件和table insertRow()、tr insertCell()的更多相关文章
- js 操作table: insertRow(),deleteRow(),insertCell(),deleteCell()方法
表格有几行: var trCnt = table.rows.length; (table为Id ) 每行有几列:for (var i=0; i<trCnt; i++) ...
- js动态添加table 数据tr td
成果库修改: 要求主题列表随成果类型改变而改变 网上查询资料后开工,在成果类型下拉框添加change()事件触发Dwr,查询主题集合——动态创建/编辑Table 概要代码 ...
- js在table指定tr行上或底下添加tr行
js在table指定tr行上或下面添加tr行 function onAddTR(trIndex) { var tb = document.getElementB ...
- Js-动态控制table的tr、td增加及删除的具体实现
<table id='wifi_clients_table' style="color:#0099CC;font-size:12px;" class="table ...
- js动态控制table的tr,td增加及删除
html: <table id='wifi_clients_table' class="table table-striped table-bordered table-hover ...
- javascript中onload事件如何绑定及执行顺序
onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...
- GridView固定行宽,自动换行,鼠标放在Table的Tr上变色
//固定行宽table-layout:fixed;//自动换行word-break :break-all;word-wrap:break-wordGridView.Attributes.Add(&qu ...
- window onload 与 img onload事件
window onload 与 img onload事件 通常,window.onload就是载入完dom之后运行的. 而img就是载入完图片完运行它的onload事件.依据img的src是否载入完毕 ...
- jq根据table的tr行数动态删除相应的行
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- Flutter页面跳转返回数据
Dart中的异步请求和等待和ES6中的方法很像,直接使用async...await就可以实现. 核心代码: _navigateToAddress(BuildContext context) async ...
- openresty开发系列21--lua的模块
openresty开发系列21--lua的模块 从lua5.1开始,Lua 加入了标准的模块管理机制,Lua 的模块是由变量.函数等已知元素组成的 table, 因此创建一个模块很简单,就是创建一个 ...
- 从0开始学爬虫2之json的介绍和使用
从0开始学爬虫2之json的介绍和使用 Json 一种轻量级的数据交换格式,通用,跨平台 键值对的集合,值的有序列表 类似于python中的dict Json中的键值如果是字符串一定要用双引号 jso ...
- Mockplus更快更简单的原型设计
更快更简单的原型设计 https://www.mockplus.cn/ Mockplus,更快更简单的原型设计工具.快速创建原型,一键拖拽创建交互,团队协作省事省力.微软.华为.东软.育碧.Oracl ...
- 我是如何同时拿到阿里和腾讯offer的 【转载】
前言 三月真是一个忙碌的季节,刚刚开学就需要准备各种面试和笔试(鄙视).幸运的是,在长达一个月的面试内推季之后,终于同时拿到了阿里和腾讯的offer,还是挺开心的.突而想起久未更新的博客,就冒昧学一学 ...
- 算法习题---5.8Unix ls命令(Uva400)
一:题目 输入正整数n以及n个文件名,将这n个文件名按照ASCII优先升序排列,按列优先方式左对齐输出. 注意:文件名最长的为M,那么最右列字符串长度为M,其他列的长度为M+2 注意:一列最多允许出现 ...
- window.open post传参
目录 前言 获取当前用户信息 使用window.open的两种方式 Get方式 Post方式 前言 我使用的场景是,点击弹窗,然后把我当前用户的消息传过去 获取当前用户信息 打开Chrome浏览器,在 ...
- 【shell比较字符串】
if [ 'AAA' = 'ABC' ]; then echo "the same" else echo "not the same" fi shell比较字符 ...
- 非常好用的JavaScript 工具库--lodash
一.什么是lodash? lodash库是一个具有一致接口.模块化.高性能等特性的 JavaScript 工具库. lodash是一个javascript库,也是Node JS的常用模块,它内部封装了 ...
- mysql 连接闪断自动重连的方法(用在后台运行中的PHP代码)
mysql 连接闪断自动重连的方法(用在后台运行中的PHP代码)当mysql断开连接 $_instance这个还是有值得 所以会报错 MySQL server has gone away 这个地方需要 ...