JS实现表格的添加，删除，搜索和排序

最新推荐文章于 2022-09-13 19:15:56 发布

VIP文章今天备忘录了吗

最新推荐文章于 2022-09-13 19:15:56 发布

阅读量346

点赞数 1

分类专栏： javascript 文章标签： javascript 开发语言前端

本文链接：https://blog.csdn.net/lachesis_/article/details/121167209

版权

在这里插入图片描述

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script type='text/javascript'>
    {
   
        window.onload = function(){
   
            initStyle();
            addRecord();
            searchRecord();
            sortRecord();
        }
        //tBodies,tHead,tFoot,rows,cells
        function initStyle(){
   
            console.log('99999');
            var table = document.getElementById('tab')
            var trs = table.tBodies[0].rows;  
            for ( var i = 0; i < trs.length; i++ ){
   
                //隔行变颜色
                if(i%2 == 0){
   
                    trs[i].style.backgroundColor = '#ccc'
                }
                //鼠标移入变绿色，移出变原来的颜色
                trs[i].onmouseover = function(){
   
                    oldColor = this.style.backgroundColor;
                    this.style.backgroundColor = 'green'
                }
                trs[i].onmouseout = function(){
   
                    this.style.backgroundColor = oldColor;
                }
            }
        }
        //添加
        function addRecord(){
   
            var btn = document.getElementById('btnAdd');
            var table =

最低0.47元/天解锁文章

今天备忘录了吗

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS实现表格的添加，删除，搜索和排序

代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&gt.
复制链接

扫一扫