当前位置:首页 > 日记 > 正文

jQuery表单(表)的基本操作实例分析

jQuery表单(表)的基本操作实例分析
本文演示了jQuery表单(表)的基本操作:

jQuery操作html表非常方便,并在此基础上对表格的基本操作进行了简要的总结。

首先,创建一个公共表CSS和一个表:

{
边界塌陷:塌陷;
边框间距:0;
保证金:汽车;
左缘:自动;
宽度:800px;
}
TH、TD
{
边境:1px solid # b5d6e6;
字体大小:12px;
字体重量:正常;
文本对齐:中心;
垂直对齐:中间;
身高:20px;
}
TH
{
背景颜色:Gray;
}

一头
头两
头三
头四
头五
第一行和第一列
第一行第二行
第一行第三行
第一行第四行
第一行第五行
第二行的第一列
第二行和第二列
第二行和第三列
第二行和第四列
第二行和第五列
第三行的第一行
第三行和第二行
第三行第三列
第三行第四列
第三行第五列
第四行的第一行
第四行和第二行
第四行第三列
第四行第四列
第四行第五列

首先,鼠标移动到线条以替换背景色:

添加CSS样式:
悬停。
{
背景颜色:# cccc00;
}

JS脚本:
$(文档)Ready(函数(){)
将鼠标移动到行/更改,建立单独的CSS悬停
gt(gt)(0):它的意思是得到所有的TR多于TR指数是0,也就是说,它不包括头。
$(# Table1 TR:GT(0)(Hover)。
函数(){ $(this)。AddClass(悬停)},
函数(){ $(this)。RemoveClass(悬停)})
});

结果实施结果:
两。形状的奇数行和偶数行的变色:

奇偶线:
。奇{背景颜色:# BBF;}
即使{背景颜色:# FFC;}

JS脚本:
$(文档)Ready(函数(){)
对于不同的颜色奇偶校验
$(#表TBODY TR:奇),AddClass(奇),
$(#表TBODY TR:即使)。AddClass(连)

/ / $(#表TBODY TR:奇),Css(背景颜色
/ / $(#表TBODY TR:即使)。Css(背景颜色
});

结果表明:
三。基本操作:

(1)删除行,例如删除表中的第二行:
删除指定的行(行秒)
$(#表3 TR:GT(0):情商(1))删除();

(2)删除列,例如删除表中的第二列:
/ /情商:0获取子元素指标,首先删除页眉
$(#表3 TR:情商(1))删除();
n:从1获取子元素
$(#表3 TR TD:nth-child(2))删除();

(3)删除其他行,如第二行之外的所有行:
$(#表3 TR:GT(0):没有(:情商(1)))删除();

(4)删除其他列,如第二列之外的所有列:
删除头文件
$(#表3 TR:不(:情商(1)))删除();
$(#表3 TR TD:不(:nth-child(2)))删除();

(5)隐藏的行,如隐藏第二行:
$(#表3 TR:GT(0):情商(1))藏();

/ / $(#表3 TR:GT(0):情商(1))。Css(显示
显示
/ / $(#表3 TR:GT(0):情商(1))。Css(显示

(6)隐藏列,如隐藏的第二列:
$(#表3 TR:情商(1))藏();
$(#表3 TR TD:nth-child(2))藏();

/ / $(#表3 TR:情商(1))。Css(显示
/ / $(#表3 TR TD:nth-child(2))。Css(显示
显示
//$(#table3 tr th:eq (1)).Css (display
/ / $(#表3 TR TD:nth-child(2))。Css(显示

(7)在表的末端插入新行:
无功newrow =新行,新行的第一行,第二列,新的行,新的行,新的生产线,第四列和第五列新的生产线,;
$(#表3 TR:去年)后(newrow);

(8)在第二行插入行和插入符:
无功newrow =新行,新行的第一行,第二列,新的行,新的行,新的生产线,第四列和第五列新的生产线,;
$(#表3 TR:GT(0):情商(1))后(newrow);

(9)获取单元格的值,如第二行和第三列:
var v = $(#表3 TR:GT(0):情商(1)TD:情商(2))。文本();
结果表明:第二/第三行

(10)获取一列的所有值,如第二列:
var;
$(#表3 TR TD:nth-child(2))。每个(函数(){()
v = $(this)。文本(+);
});
结果:第一、二线、二线、二线、第三线二

(11)获取一行的所有值,如第二行:
var;
$(#表3 TR:GT(0):情商(1)TD)。每个(函数(){)
v = $(this)。文本(+);
});
结果:第二列第二行的第二行/第二行和第三列的第二行和第二行的第四列和第二行和第五列

(12)合并行单元格,例如合并第二行第二和第三个单元格:
$(#表3 TR:GT(0):情商(1)TD:情商(1))Attr(合并单元格。
$(#表3 TR:GT(0):情商(1)TD:情商(2))删除();

(13)拆卸分支的单元单元恢复上述合并单元格:
请注意,您不能使用 /
/ / $(#表3 TR:GT(0):情商(1)TD:情商(1))。RemoveAttr(合并单元格);
$(#表3 TR:GT(0):情商(1)TD:情商(1))Attr(合并单元格。
$(#表3 TR:GT(0):情商(1)TD:情商(1))。后(第二行第三列)

(14)合并列单元格,例如合并第二列和第二单元格和第三个单元格。
$(#表3 TR:GT(0):情商(1)TD:情商(1))。Attr(行
$(#表3 TR:GT(0):情商(2)TD:情商(1))删除();

(15)分裂一个列单元格,例如恢复刚才合并的单个单元格:
$(#表3 TR:GT(0):情商(1)TD:情商(1))。Attr(行
在第一个单元格之后插入单元格
$(#表3 TR:GT(0):情商(2)TD:情商(0))。后(第三行第二列);

(16)为每个单元格添加一个单击事件,并弹出单元格行索引和列索引:
$(文档)Ready(函数(){)
点击返回#表3细胞/细胞指数
$(#表3 TD)。Click(function(){)
无功tdseq =美元(这)。父(),发现(TD)。指数($(this));
无功trseq =美元(这)。父(母),(),(TR)。指数($(this)。父());
警报(第一+(trseq)+ ,+(tdseq + 1)+柱);
})
});

附:本站下载完整的示例代码。

更多关于jQuery相关内容的读者可以看到特别站:jQuery表(表)、jQuery操作技巧、总结切换效果和技巧总结jQuery

希望本文能对jQuery程序设计有所帮助。

相关文章

用js(推荐)判断各种数据类型的简单方

用js(推荐)判断各种数据类型的简单方

推荐,方法,数据类型,简单,电脑软件,知道JS的人都知道,有一种判断各种数据类型,有写的方式有两种:XXX(XXX)类型,类型 以下示例如下: 类型2输出数 零输出对象类型 { }类型对象的输出 { }输出对象类型 Typeof(功能){ }(输出功能) 类定义的输出定义…

三种利用ps对水印进行水印的方法

三种利用ps对水印进行水印的方法

方法,水印,三种,电脑软件,ps,通常在互联网上下载的图像通常会有水印。如果直接使用,会影响外观。使用ps进行水印无疑是最好的。这里有一点关于如何水印PS。 点愈合刷工具 1、在使用PS图象处理软件去除水印,我们应该观察图像并选择合适的工…

在excel中用斜线快速输入零

在excel中用斜线快速输入零

输入,中用,快速,电脑软件,excel,正如你所知道的,数字0和字母O在计算机中非常相似。有时为了便于区分这两个字符,我们可以在数字0的中间加一个斜线。那么,如何在Excel中添加一个斜线到数字0呢让我们来教你一个办法:第一,通过正规途径在细胞0个数…

ppt2013如何导出教程ppt2013教程保

ppt2013如何导出教程ppt2013教程保

教程,模板,幻灯片,电脑软件,我们在制作PPT演示文稿,一般用漂亮的模板,如果我们想保存一个模板,如何拯救它对于新手还是有一定的难度,如何做下面的萧边立即告诉我们,ppt2013保存幻灯片模板的方法。 ppt2013出口保存幻灯片模板的方法 首先,打开pp…

干货:10超级实用经验分享PS图象处理

干货:10超级实用经验分享PS图象处理

霸道,经验分享,干货,图象,处理软件,当我们看到越来越多的PS教程和更多的PS技能的掌握,它可以反映你是否第一次看到第一个教程都是正确的。今天的国外高质量的翻译教程,跟你一起看PS图象处理软件高的手分享10 PS图象处理软件,正式干货! 图00 1…

AI画布如何编辑AI来调整绘图板的方

AI画布如何编辑AI来调整绘图板的方

删除,调整,绘图板,编辑,电脑软件,在绘图板的基本操作 软件名称:Adobe Illustrator CS6(AI CS6)简化绿色中文版(32位+ 64位)软件大小:205mb更新时间:2014-05-11 1、选择画板工具。 2,单击左边可以创建一个新的绘图板,并单击右边删除绘图板。 三.在…

ps输入字母显示的是大写字母。

ps输入字母显示的是大写字母。

输入,显示,的是,大写字母,字母,当我们用PS图象处理软件,我们经常遇到的一些问题。最近,萧边看到一个网友的帮助--过,,和所有的字母都大写。你可能尝试了很多方法,对于这个问题。今天,小编辑要谈谈他的小经历。 软件名称:Adobe PS图象处理软件7.01…

js循环添加点击事件(关闭应用程序)

js循环添加点击事件(关闭应用程序)

循环,应用程序,点击事件,电脑软件,js,废话没多说,直接给大家粘代码,具体代码如下所述: VaR阿里= document.queryselectorall('。文章标签里); 对于(var i = 0;i (函数(){()) var = i ALi {我}。onclick =函数(){ 警报(P); } }); } 以上是JS周期里添加点击事件(…

如何在WPS文本中向WPS文本教程添加

如何在WPS文本中向WPS文本教程添加

文本,教程,自定义,水印,中向,如何添加自定义水印的WPS文字。为公司平时的一些机密文件,我们通常通过文件,我们害怕被抄袭的。所以我们将印上我们自己的标准,WPS文字水印怎么加起来,我想建立自己的水印和如何设置。下面将告诉你如何去做。 一种…

如何快速复制填充在CorelDraw

如何快速复制填充在CorelDraw

填充,快速,电脑软件,CorelDraw,除了使用属性滴管工具可以复制对象的填充效果,并使用快捷菜单选择复制属性,并填写一个对象的填充效果来填补另一个对象,本文将教你一个简单而快速的对象的填充效果复制在CorelDRAW。 在工具箱中,单击选择工具;选…

ai文本如何对齐ai文本排版

ai文本如何对齐ai文本排版

文本,对齐,电脑软件,ai,AI想要对齐文本,你如何对齐不是在设计海报的时候,调整文本是非常重要的。下面我们来看看详细的教程。 软件名称:Adobe Illustrator CC(AI)2016破解版64位简体中文版软件大小:1.67gb更新时间:2016-04-11 1。按住Shift选择…

CDR只是一个立体字。

CDR只是一个立体字。

立体字,只是一个,电脑软件,CDR,下面为大家介绍一个简单的CDR生成的三维文字方法,步骤很简单,不是朋友可以参考这篇文章哦! 步: 1、打开CorelDRAW X4软件,输入所需的文字。这里是例如,颜色填充蓝色,复制一个为以后使用; 2,找到左侧;立体工具; 3、选…