首页 > 技术文章 > 表格基础

f6056 2018-07-09 13:49 原文

  表格应用-1

  获取

  tBodies、tHead、tFoot、rows、cells

  隔行变色

  鼠标移入高亮

  删除、添加一行

  表格应用-2

  搜索

  版本1:基础版本——字符串比较

  版本2:忽略大小写——大小写转换

  版本3:模糊搜索——search的使用

  版本4:多关键词——split

  高亮显示、筛选

  排序

  移动Li

  元素排序:转换——排序——插入

  表单应用-1

  表单基础知识

  什么是表单

  向服务器提交数据,比如:用户注册

  action 提交到哪里

  表单事件

  onsubmit 提交时发生

  onreset 重置时发生

  表单应用-2

  表单内容验证

  阻止用户输入非法字符 阻止事件

  输入时、失去焦点时验证 onkeyup、onblur

  提交时检查 onsubmit

  *后台数据检查


 

  表格元素的快捷获取方式

       JS在表格中获取元素时,

  getElementsByTagName('tbody')[i]与tBodies[i]是等效的;

  getElementsByTagName('tr')[i]与rows[i]是等效的;

  getElementsByTagName('td')[i]与cells[i]是等效的;

  getElementsByTagName('thead')[0]与tHead是等效的;

  getElementsByTagName('tfoot')[0]与tFoot是等效的;

  一个表格只允许有一个thead元素和tfoot元素,而可以拥有多个tbody元素,故而tBodies获取的是数组,而tHead与tFoot获取的是元素。

  th标签定义表格内单元格表头;thead标签定义表格的表头。