<script type="text/javascript">
/*动态控制表格*/
/*动态添加*/
window.onload=function(){
var oTab=document.getElementById("tab").insertRow(2);//在表格第三行插入一行数据,索引从0开始.
var arr=new Array();
arr[0]=document.createTextNode("张三");
arr[1]=document.createTextNode("李四");
arr[2]=document.createTextNode("王五");
arr[3]=document.createTextNode("赵六");
arr[4]=document.createTextNode("田七");
for(var i=0;i<arr.length;i++){
var oTd=oTab.insertCell(i);//添加单元格.
oTd.appendChild(arr[i]);//在单元格内添加内容
}
}
</script>
</head>
<body>
<table id="tab">
<tr>
<td>111</td>
<td>222</td>
<td>333</td>
<td>444</td>
<td>555</td>
</tr>
<tr>
<td>555</td>
<td>444</td>
<td>333</td>
<td>222</td>
<td>111</td>
</tr>
</table>
</body>
</html>
<script type="text/javascript">
/*动态控制表格*/
/*动态删除*/
window.onload=function(){
var oTable=document.getElementById("tab");
oTable.deleteRow(2);//删除一行,后面的行号自动补齐
oTable.rows[2].deleteCell(1);//删除第二个单元格,后面单元格自动补齐
}
</script>
</head>
<body>
<table id="tab" border="1">
<tr>
<td>111</td>
<td>222</td>
<td>333</td>
<td>444</td>
<td>555</td>
</tr>
<tr>
<td>555</td>
<td>444</td>
<td>333</td>
<td>222</td>
<td>111</td>
</tr>
<tr>
<td>777</td>
<td>888</td>
<td>999</td>
<td>1010</td>
<td>1111</td>
</tr>
<tr>
<td>000</td>
<td>xxx</td>
<td>zzz</td>
<td>ttt</td>
<td>qqq</td>
</tr>
</table>
</body>
</html>
<script type="text/javascript">
/*表单基础*/
/*可以通过document.form集合来引用表单,例如一个name属性为"myForm1"的表单
可以用如下语句来获得:document.forms["myForm1"]
其中HTML部分为:
<form method="post" name="myForm1" action="addInfo.aspx">
*/
/*限制文本域输入的字符*/
function LessThan(oTextArea){
//通过得到文本域输入字符的长度和指定的最大长度(maxlength)得到的boolean值来限制输入的字符数.
return oTextArea.value.length < oTextArea.getAttribute("maxlength");
}
</script>
</head>
<body>
<!--注:textarea并无maxlength属性,这里的maxlength属性是纯属自己添加用来设置最大字符数!-->
<!--onkeypress当键盘按下时激发-->
<textarea id="comment" cols="20" rows="10" onkeypress="return LessThan(this)" maxlength="50">
</textarea>
</body>
</html>
<title>无标题文档</title>
</head>
<body>
<!--鼠标经过时自动聚焦,当光标移入文本域时文本域自动获得焦点,然后当获得焦点时自动聚焦-->
<textarea id="comment" cols="20" rows="10" onmouseover="this.focus();" onfocus="this.select();" >
请在此输入您要输入的内容.
</textarea>
</body>
</html>
分享到：
相关推荐
javascript简单的表单交互
javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单javascript二级联动表单
基于element-ui 的form表单实现的一个高拓展性的表格布局组件，能够用于日常使用表单的布局实现。
javascript实现网页中表格的行随着鼠标移动而变色，实时变色表格行
简洁的语法和跨平台的兼容性，极大的简化了javascript开发人员遍历HTML文档、操作DOM、处理事伯、执行动画操作AJAX的操作。 屏蔽浏览器差异，对DOM的操作提供了方便的扩展，易用的事件处理API和动画API数据接口。
用JavaScript实现的动态表格，双击可以实现不同类型的单元格内容的更改，有增删改的更能，可以上传图片，放大图片显示，日历，JavaScript验证等
按回车键时跳到下一个表单元素的javascript代码 <br>函数说明：按回车键时跳到下一个表单元素 JumpToNextElement() 用于按回车键时跳到下一个表单元素（统一处理按回车键的问题） 在页面调用： <script ...
一个检测表单数据的JavaScript实例，很简单，很实用，感兴趣的朋友可以看看 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> &...
主要内容包括JavaScript的概念和基本语法、CSS基础、CSS排版、DOM模型框架、网页中的事件、表格表单、JavaScript的调试与优化、Ajax异步技术等。在此基础之上又通过精彩的实例详细讲解了jQuery的相关技术：主要包括...
vue Element-ui表格实现树形结构表格 本文实例为大家分享了Element-ui表格实现树形结构表格的具体代码，供大家参考，具体内容如下 前端效果展示: 在el-table中，支持树类型的数据的显示。当 row 中包含 ...
jQuery表格行全选反选单选代码，例子采用bootstrap格式，可以选择自定义。
js读取本地json数据文档，动态生成列数不固定的表格并填充数据。
利用CSS动画制作 Html 表格数据滚动显示, 实际自己开发也不难实现。实现的方法很多，下面是本人的一种实现方案，分享给大家。
表单验证Javascript- 用Javascript完成表单验证 该项目使用HTML，引导程序和Javascript来利用表单验证，以确保用户正确填写表单。 以下是提交表单的表单验证要求： 用户名输入字段不能为空，并且必须包含两个以上...
SurveyJS 是一个 JavaScript 调查和表单库。 SurveyJS 是一种向您的网站添加调查和表单的现代方式。 它有 Angular、jQuery、knockout、react 和 vue 的版本。 文档 SurveyJS 库 文档实时示例 SurveyJS 库实时示例 ...
1、创建一个5行4列的表格、表示一行，表示一列，表示这一列加粗显示。 2、给表格的元素赋值 3、创建Javascript的表单
主要介绍了javascript实现自动填写表单的方法,以一个简单实例形式分析了JavaScript结合浏览器设置实现自动保存表单的相关技巧,需要的朋友可以参考下
9.36 使用JavaScript向表格中写入数据 9.37 类C# GridView的编辑效果（一） 9.38 类C# GridView的编辑效果（二） 第10章 单选框和复选框 10.1 选择了哪一个单选框 10.2 单击文字实现单选框的选定 10.3 被选中的复选...
8.5.5 更改表格间隔背景色 219 第9章 JavaScript中的XML 223 9.1 XML语言 223 9.1.1 XML概述 223 9.1.2 XML文档结构 225 9.1.3 XML标记 226 9.1.4 XML文档元素 226 9.1.5 XML属性 229 9.1.6 XML命名空间 230 9.2 XML...
基础到复杂 和扩展使用～ HTML 文件结构 文字 图片 链接 表格 表单 多窗口 特殊字符…… CSS细节 CSS的各种属性 Javascript介绍 Javascript语言