web前端之js实现表格增删和鼠标事件

最新推荐文章于 2023-08-28 16:31:58 发布

zhangFreedom

最新推荐文章于 2023-08-28 16:31:58 发布

阅读量409

点赞数

文章标签： js web前端

本文链接：https://blog.csdn.net/weixin_43286092/article/details/101066348

版权

本文主要探讨了如何使用JavaScript在web前端实现表格的动态添加和删除行功能，并详细讲解了如何添加鼠标事件，包括点击、 hover 和选中效果。通过实例代码，帮助读者理解JavaScript在交互式表格操作中的应用。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
 <head>
  <title> new document </title>  
  <meta http-equiv="Content-Type" content="text/html; charset=gbk"/>   
  <script type="text/javascript"> 
       // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
       //下面的匿名函数可以不要
    window.onload = function(){
   
        var tr=document.getElementsByTagName("tr");
          for(var i= 0;i<tr.length;i++)
          {
   
              bgcChange(tr[i]);
          }           
	 }
	 //鼠标悬停事件
	 function bgcChange(obj)
     {
   
        obj.onmouseover=function(){
   
            obj.style.backgroundColor="#CCC"

最低0.47元/天解锁文章

zhangFreedom

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
web前端之js实现表格增删和鼠标事件

这里写自定义目录标题生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入在这里插入代码片<!DOCTYPE html><html> <head> <title> ...
复制链接

扫一扫