`

JQuery表的操作

阅读更多
二、操作
1.鼠标移动行变色
$("#table1 tr").hover(function(){   
    $(this).children("td").addClass("hover")   
},function(){   
    $(this).children("td").removeClass("hover")   
})   
$("#table2 tr:gt(0)").hover(function() {   
    $(this).children("td").addClass("hover");   
}, function() {   
    $(this).children("td").removeClass("hover");   
});  

2.奇偶行不同颜色
$("#table3 tbody tr:odd").css("background-color", "#bbf");   
$("#table3 tbody tr:even").css("background-color","#ffc");    
$("#table3 tbody tr:odd").addClass("odd")   
$("#table3 tbody tr:even").addClass("even")   

3.隐藏一行
$("#table3 tbody tr:eq(3)").hide(); 

4.隐藏一列
$("#table5 tr td::nth-child(3)").hide();   
$("#table5 tr").each(function(){$("td:eq(3)",this).hide()});
 
5.删除一行
// 删除除第一行外的所有行   
$("#table6 tr:not(:first)").remove();  

6.删除一列
// 删除除第一列外的所有列   
$("#table6 tr td:not(:nth-child(1))").remove();  

7.得到(设置)某个单元格的值
//设置table7,第2个tr的第一个td的值。     
$("#table7 tr:eq(1) td:nth-child(1)").html("value");     
//获取table7,第2个tr的第一个td的值。     
$("#table7 tr:eq(1) td:nth-child(1)").html(); 
  
8.插入一行:
//在第二个tr后插入一行   
$("<tr><td>插入3</td><td>插入</td><td>插入</td><td>插入</td></tr>").insertAfter($("#table7 tr:eq(1)"));


来自:Forgot.
分享到:
评论

相关推荐

    Jquery学习 Jquery源代码 Jquery数据库操作

    Jquery学习 Jquery源代码 Jquery数据库操作 Jquery学习 Jquery源代码 Jquery数据库操作 绝对有用,技术含量

    Jquery各种连接操作 Ajax Jquery

    Jquery各种连接操作 Ajax JqueryJquery各种连接操作 Ajax Jquery

    jquery 操作表格

    本文将深入探讨如何使用jQuery操作表格,基于给出的资源,我们可以看到一个与表格相关的示例。 首先,"tb-bg.gif"可能是一个表格背景图像,用于美化表格的视觉效果。在网页设计中,背景图片可以提升表格的整体风格...

    jQuery操作文件夹

    在IT领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。尽管jQuery主要用于处理HTML文档,但它并不能直接操作文件或文件夹,因为浏览器的安全策略不允许...

    jQuery实现的主从表的使用

    本主题将深入探讨如何使用jQuery来实现主从表的交互功能,这是一种常见的数据展示方式,尤其在企业管理软件和数据分析应用中。 主从表(Master-Detail)是一种数据库关系模型,主表通常包含一组记录,而从表则对应...

    jQuery仿Windows系统文件夹目录操作代码.zip

    - **文件夹和文件列表**:项目中的`index.html`很可能包含一个文件夹和文件的列表,每个条目可能是一个`&lt;li&gt;`元素,带有相应的类名或ID以便于jQuery操作。 - **交互元素**:可能会有按钮或图标(如展开/折叠箭头)...

    jquery 冻结表头的代码。 我试过了,很好用。

    `jquery-1.3.2.min.js`是jQuery库的压缩版,这个版本的jQuery发布于2009年,虽然相对较旧,但它仍然能够支持大部分基本的jQuery操作,如选择元素、事件处理、DOM操作等。在冻结表头的场景中,jQuery主要用于操作DOM...

    jQuery表情评价打分代码.zip

    1. HTML文件:这是网页的主体,包含了jQuery库、CSS样式表链接以及用于构建评价系统的JavaScript代码。 2. CSS文件:用于控制界面的视觉效果,如表情图标的样式、评分条的外观等。 3. 图片资源:包括表情图标和其他...

    jQuery 1.4.1 速查表 jQueryAPI

    **jQuery 1.4.1 速查表与jQuery API** jQuery 是一款高效、简洁的JavaScript库,它极大地简化了JavaScript编程,特别是DOM操作、事件处理、动画制作以及Ajax交互。jQuery 1.4.1 是该库的一个早期版本,尽管现在已经...

    jQuery 操作 Form 元素 v1.0

    jQuery 操作 Form 元素 v1.0 for jQuery1.4.2,IE7/FF3.6.2下测试通过 作者:西安 网眼 博客:http://blog.why100000.com 微博:http://t.qq.com/zhangking 西安PHP教育培训中心 2010-6-20

    jquery制作的仿苹果操作系统的菜单

    本项目“jquery制作的仿苹果操作系统的菜单”旨在利用jQuery的灵活性和强大功能,创建一个与苹果操作系统(Apple's UI)风格类似的动态菜单。这种菜单能够提供用户友好的体验,增强网站或应用程序的视觉吸引力。 ...

    jQuery入门jQuery入门

    - **快速上手**: 通过简单的示例代码演示jQuery的基本使用方法,帮助初学者快速理解如何使用jQuery选择元素、操作DOM等。 - **示例**: 假设有一个简单的HTML结构,可以通过jQuery轻松地选中某个元素并为其添加样式或...

    jquery操作XML

    封装JQUERY操作XML文档的函数 fnAIString2Xml fnAIXML2String fnAIAddXmlNode fnAIRemoveXMLNode fnAISetXMLNodeAttr fnAIFindXMLNode

    jQuery页面操作手册

    个人总结的jQuery页面操作记录,包括jQuery的基本使用方法和对页面表单控件的各种操作。

    jquery分步操作插件step.js

    jquery分步操作插件step.js,代码注释全修改方便,网上基本链接都已经崩掉了,无法访问,幸亏本地有备份文件,这次放上来以供大家使用

    jquery制作统计表

    总结来说,"jquery制作统计表"项目通过jQuery的DOM操作、事件处理、动画以及可能的第三方库集成,实现了一系列直观、交互性强的统计报表。这些报表有助于数据的展示和分析,而项目中的各个文件则共同构成了一个完整...

    jQuery CSS3价格表插件.zip

    jQuery的核心功能包括选择器(用于查找HTML元素)、DOM操作(添加、删除或修改元素)、事件处理和动画效果。在本例中,jQuery可能被用来监听用户的鼠标滑过事件,触发价格表的动画展示。 CSS3是CSS(层叠样式表)的...

    jquery网站功能引导用户提示操作

    "jquery网站功能引导用户提示操作"就是一种实现这一目标的技术手段。jQuery,一个广泛使用的JavaScript库,提供了丰富的功能和简单易用的API,使得创建这种用户引导提示变得轻而易举。 首先,我们需要理解jQuery的...

    jquery-3.4.1_jquery_3.4.1.js_jquery-3.4.1_sangat1_jquery3.4.1_jq

    jQuery通过提供一套丰富的API,使得开发者可以快速实现常见的网页操作,如选择元素、添加事件监听器、执行AJAX请求等,而无需编写大量复杂的原生JavaScript代码。 在标签中,"jquery_3.4.1.js"和"jquery-3.4.1"再次...

    jQueryDemo(JQuery常用操作2005)

    《jQueryDemo:深入理解JQuery常用操作》 jQuery,作为一款强大的JavaScript库,极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。在"jQueryDemo(JQuery常用操作2005)"中,我们将深入探讨jQuery...

Global site tag (gtag.js) - Google Analytics