`
niulanshan
  • 浏览: 564193 次
文章分类
社区版块
存档分类
最新评论

*选择器(jQuery)

 
阅读更多

1、*:匹配所有的元素,用于结合上下文来搜索

2、实例

all.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");
		//匹配所有元素
		$("*").css("background-color","#CCFF33");
	});
</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、显示结果如下


分享到:
评论

相关推荐

    jquery周历选择器

    本项目“jquery周历选择器”利用jQuery的灵活性和易用性,构建了一个适用于混合应用程序(Hybrid App)的周历选择器组件。 1. **周历选择器设计**: - 周历选择器通常用于日程管理或时间规划应用,显示一周的日期...

    JQuery选择器测试 离线版

    在jQuery中,选择器分为多种类型,包括基础选择器、类别选择器、ID选择器、属性选择器、后代选择器、子元素选择器、相邻兄弟选择器和通用选择器等。 1. **基础选择器**:主要包括`$()`,用于选取一个或多个DOM元素...

    jQuery datepicker 日期选择器 中文汉化版 开始日期结束日期

    jQuery UI的日期选择器(jQuery datepicker)是一个广泛使用的组件,尤其在网页表单中用于输入日期时。这个组件提供了一个优雅、用户友好的界面,允许用户通过日历视图来选择日期,而不是手动输入。在中文环境中,...

    一个简单的jQuery时间选择器

    【标题】"一个简单的jQuery时间选择器" 描述了如何使用jQuery库来创建一个用户友好的时间选择界面。在Web开发中,特别是涉及到用户输入时间的场景,如预订、会议安排等,拥有一个直观易用的时间选择器可以极大提升...

    jquery一些案列和一些选择器

    **jQuery基础及选择器详解** jQuery 是一个广泛应用于Web开发的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理和动画制作。本教程将基于提供的"jquery一些案列和一些选择器"来深入理解jQuery的核心...

    jquery api, jquery ui api, jquery源码分析

    1. **选择器引擎(Sizzle)**:jQuery 使用Sizzle作为其选择器引擎,它是如何快速高效地解析CSS选择器并找到匹配元素的。 2. **链式调用(Chaining)**:jQuery对象返回自身,允许连续调用多个方法,这是其优雅语法...

    jQuery基础选择器练习题

    本篇文章将深入探讨jQuery的基础选择器及其在实际编程中的应用,以帮助你更好地理解和掌握这些知识点。 首先,我们来了解一下jQuery的基本选择器。它们是用于选取HTML元素的最基础工具,包括: 1. **ID选择器**: ...

    jQuery颜色选择器ColorPicker

    **jQuery颜色选择器ColorPicker详解** 在Web开发中,用户界面的交互性和视觉效果往往对用户体验有着重要影响。其中,颜色选择器是一个常见的组件,它允许用户方便地选取颜色。`jQuery ColorPicker`是一个轻量级且...

    jQuery时间选择器点击选择小时分钟代码

    在网页开发中,jQuery时间选择器是一个非常实用的工具,它允许用户通过点击来选取特定的小时和分钟,为表单输入提供了便利。这个“jQuery时间选择器点击选择小时分钟代码”很可能是一个实现这一功能的代码示例或者...

    jquery时间选择器

    "jquery时间选择器"是基于jQuery的一个组件,旨在为用户在网页上提供一个直观且易于使用的日期和时间输入界面。这个组件使得用户能够方便地通过下拉菜单或者滑动条选择日期和时间,而不是手动输入,提高了用户体验。...

    jquery 城市联动选择器

    **jQuery城市联动选择器** 在Web开发中,用户界面经常需要提供一种便捷的方式来选择地理位置,例如省份、城市和区县。这种需求催生了各种各样的联动选择器,其中`jQuery`城市联动选择器是一个非常实用的解决方案。...

    jquery基本选择器

    **jQuery基本选择器** jQuery库是JavaScript中最广泛使用的库之一,它简化了DOM操作、事件处理和动画制作。其中,选择器是jQuery的核心功能之一,它使得能够高效地选取页面中的HTML元素。以下是对jQuery基本选择器...

    jQuery学习资料之万能的选择器

    - **DOM转jQuery**:通过`$(DOM对象)`可以将DOM对象转换为jQuery包装集。 - **jQuery转DOM**:可以使用索引访问包装集中的DOM对象,如`$("#testDiv")[0]`,或者在`.each()`遍历中,`this`指针指向当前遍历的DOM元素...

    jquery实现颜色选择器

    **jQuery 实现颜色选择器** 在网页开发中,颜色选择器是一个常见的交互元素,它允许用户方便地选取颜色。在本教程中,我们将探讨如何利用 jQuery 和相关插件来实现一个功能完备的颜色选择器。 首先,`jQuery` 是一...

    jquery颜色选择器

    4. **初始化插件**:在页面加载完成后(通常在`$(document).ready()`函数中),使用jQuery选择器找到元素并调用颜色选择器插件的初始化方法,设置相关配置,如预设颜色、回调函数等。 5. **事件监听**:你可以监听...

    【商品价格选择器JQuery】demo

    【商品价格选择器JQuery】是一个在网页中用于动态选择和展示商品价格的交互组件,常见于电商网站的商品详情页面。这个组件利用了JavaScript库JQuery的高效和易用性,为用户提供了一种直观的方式来浏览和选择不同价格...

    jquery 动态选择器

    本文将深入探讨“jQuery动态选择器”这一主题,结合标签中的“源码”和“工具”概念,我们将会看到jQuery如何通过其丰富的选择器功能来高效地选取和操作网页元素。 动态选择器是jQuery的核心特性之一,它允许开发者...

    jquery日期选择器

    **jQuery日期选择器详解** 在Web开发中,用户界面的交互性和用户体验往往直接影响到网站的质量。日期选择器作为常见的交互元素之一,对于处理日期输入场景非常有用。"jQuery日期选择器"是这样一个轻量级且易用的...

    jQuery选择器.rar

    这个名为"jQuery选择器.rar"的压缩包文件显然包含了关于jQuery选择器的相关学习资源,可能包括示例代码、教程文档等。这些内容可能与《锋利的jQuery第二版》这本书中的章节相匹配,该书是jQuery学习的经典参考资料之...

    jQuery商品价格选择器

    《jQuery商品价格选择器详解与应用》 在Web开发中,jQuery库因其简洁易用的API和强大的功能,被广泛应用于各种交互设计中。本文将深入探讨如何利用jQuery实现一个商品价格选择器,以提升用户体验并优化购物过程。 ...

Global site tag (gtag.js) - Google Analytics