类选择器（Class）jQuery
1、.class:根据给定的类匹配元素
2、实例如下
class.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>类选择器</title>
<script type="text/javascript" src="jquery-2.0.3.js"></script>
<style type="text/css">.tr_odd{background:#CCFFFF;}.tr_even{background:#CCFF00;}
</style>
<script type="text/javascript">$(function(){//设置表格的背景色$(".tab").css("background-color","#EBEBEB");//设置表格的宽度$(".tab").css("width","50%");//设置表格的高度$(".tab").css("height","150px");//设置表头的背景色$(".tab_tr th").css("background-color","#DEB887");//设置表体的字对齐方式$("tr td").css("text-align","center");//设置表格体边框$("tr td").css("border","1px solid #006666");//设置奇数行表格背景色$("tr:odd").addClass("tr_odd");//设置偶数行表格的背景色$("tr:even").addClass("tr_even");});
</script>
</head><body><table class="tab"><tr class="tab_tr"><th>学号</th><th>姓名</th><th>年龄</th> <th>性别</th> <th>地址</th> <th>爱好</th> <th>电话</th></tr><tr><td>2012010101</td><td>张三丰</td><td>34</td><td>男</td><td>湖北省武汉市</td><td>足球</td><td>15245245555</td></tr><tr><td>2012010102</td><td>赵忠项</td><td>25</td><td>男</td><td>湖北省黄冈市</td><td>篮球</td><td>14245245555</td></tr><tr><td>2012010103</td><td>孙晓雪</td><td>34</td><td>女</td><td>湖南省长沙市</td><td>羽毛球球</td><td>14512455555</td></tr><tr><td>2012010104</td><td>李雪加</td><td>28</td><td>女</td><td>广东深圳市</td><td>网球</td><td>14512445555</td></tr><tr><td>2012010105</td><td>孙晓雪</td><td>34</td><td>女</td><td>湖南省长沙市</td><td>羽毛球球</td><td>14512455555</td></tr><tr><td>2012010106</td><td>李雪加</td><td>28</td><td>女</td><td>广东深圳市</td><td>网球</td><td>14512445555</td></tr><tr><td>2012010107</td><td>孙晓雪</td><td>34</td><td>女</td><td>湖南省长沙市</td><td>羽毛球球</td><td>14512455555</td></tr><tr><td>2012010108</td><td>李雪加</td><td>28</td><td>女</td><td>广东深圳市</td><td>网球</td><td>14512445555</td></tr><tr><td>2012010109</td><td>孙晓雪</td><td>34</td><td>女</td><td>湖南省长沙市</td><td>羽毛球球</td><td>14512455555</td></tr><tr><td>2012010110</td><td>李雪加</td><td>28</td><td>女</td><td>广东深圳市</td><td>网球</td><td>14512445555</td></tr></table>
</body>
</html>
3、显示结果如下图：
类选择器（Class）jQuery相关推荐
- 使用css伪类选择器,css的伪类选择器的使用
伪类选择器,在不同情况下显示的css,伪类选择器在处理页面的美观是很大帮助.其实很多美丽的按钮或者页面都是有这些基础的知识实现的,掌握好基础很重要. 名字 实例 说明 :link a:link 选择所 ...
- JQuery中的类选择器
类选择器 类选择器,顾名思义,通过class样式类名来获取节点 使用方式为$( ".class" ) 类选择器,相对id选择器来说,效率相对会低一点,但是优势就是可以多选 同样的j ...
- id jquery选择器 开头_HTML的id选择器类选择器
一.问题:我们前面讲了标签选择器有一个缺陷就是它不加选择的把所有相同的标签全都变成统一样式,这对于我们个性化定制产生了阻碍,因此我们便引出了id选择器,来进行特别指定进行配置样式 二.id选择器 1. ...
- 23、jQuery九类选择器/jQuery常用Method-API/jQuery常用Event-API
1)掌握jQuery九类选择器及应用 2)掌握jQuery常用Method-API 3)掌握jQuery常用Event-API 一)jQuery九类选择器[参见jQueryAPI.chm手册] 目 ...
- jQueryDom和源生DOM相互的转换、jQuery选择器语法、JQuery层次选择器语法、jQuery属性选择器语法、jQuery伪类选择器语法、
jQuery和源生DOM的转化 案例 <body> <p id="test">123</p> <p>456</p> &l ...
- jquery选择器、标签选择器、类选择器、元素选择器、*选择器、this关键字
目录 元素选择器 列:段落隐藏 #id选择器 列: .class选择器 列: CSS选择器 列: *选取所有元素 列:#选择器.*选择器.类选择器.元素选择器练习 this选取当前html元素 列:选 ...
- JavaScript(12) jQuery选择器(基本选择器、层级选择器、伪类选择器、属性选择器)
提示:我们可以从jquery文档上学习哦~ 下面简单的介绍几种常用的选择器 ===================================基本选择器=============== ...
- jQuery九类选择器
jQuery选择器基本选择器 #id/标签名/样式名/选择器A,选择器B jQuery层次选择器 *form input:查询form下所有input元素,含有后代关系 form>input:查 ...
- jQuery伪类选择器
一.简单伪类选择器 :not(selector) 选择除了某个选择器之外的所有元素 :first或first() 选择某元素的第一个元素(非子元素) :last或last() 选 ...
最新文章
- 结合实例与代码谈数字图像处理都研究什么？
- JBPM4.4_jBPM4.4应用(与Spring集成自行控制事务等)
- 区块链技术 好文收藏
- expect一键登录mysql
- leetcode 383 赎金信 C++
- 哥廷根，世界数学家的摇篮和圣地
- uniapp 仿钉钉考勤统计页面的日历组件，通过日历展示每日考勤打卡情况，支持在日历上打两种不同类型的点，大致适配各种分辨率
- JS模拟实现数组的map方法
- 错误调试：Ubuntu-Tensorflow ，程序手动结束后，GPU的显存没有被释放
- MSSql使用SQL语句快速查看表对的就说明，及表字段描述及字段类型
- linux运行bak,linux 备份学习
- word手动设置编号起始值
- cad线性标注命令_CAD中线性标注的快捷命令是什么
- 【现代控制理论基础】二、线性控制系统的运动分析
- UEFI学习——使用gRT-＞GetVariable读取Setup选项值
- applyTo、renderTo 区别
- 基于华为路由器实现NAT
- 如何实现打开网页自动弹出QQ对话框
- 知识共享许可协议 Creative Commons Licenses
- 51单片机通过DHT11温度传感器读取温度（2）