`
zhiming_817
  • 浏览: 164847 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

jquery 选择器练习

    博客分类:
  • ajax
阅读更多
<html>
	<head>
		<script type="text/javascript" src="jquery-1.4.1.js"></script>
		<script type="text/javascript">
			$("document").ready
			(
					function()
					{
						$("a").click(function(){
					
							$('#ui1>li').addClass('uiCss');
							
							$('tr:odd').addClass('odd');
								//$('tr:even').addClass('even');
								$('tr').filter(':even').addClass('even');
								$('th').parent().addClass('table-heading');
								$('td:contains("789")').siblings().addClass('highlight');
							});
						
						
					}
      );

					
			</script>
			<style type="text/css">
				.uiCss
				{
					float:left;
					list-style:none;
					margin:10px;
				}
				.odd
				{
					background-color:#ffc;
				}
				.even
				{
					background-color:#cef;
					}
					.table-heading {
  background-color: #ff0;
}
	.highlight {
  color: #f00;
  font-weight: bold;
}			</style>
	</head>
	
	<body>
		
		<a  id="getajax" href="#" class="hello" >单击改变列表样式</a>
		<ul id="ui1">
			<li>广州
					<ul>
							<li>销售</li><li>技术</li><li>财务</li>
					</ul>
			</li>
			<li>北京
				<ul>
							<li>销售</li><li>技术</li><li>财务</li>
					</ul>
			</li>
			<li>上海
				<ul>
							<li>销售</li><li>技术</li><li>财务</li>
					</ul>
			</li>
		</ul>
		<table>
			<tr>
					<th>t
					</th>
					<th>h
					</th>
			</tr>
				<tr>
					<td>123</td><td>456</td>
					</tr>
					<tr>
					<td>123</td><td>456</td>
					</tr>
					<tr>
					<td>123</td><td>456</td>
					</tr>
					<tr>
					<td>789</td><td>789</td>
					</tr>
		</table>
	</body>
	
</html>

 

分享到:
评论

相关推荐

    JQuery选择器练习

    使用JQuery进行操作练习,从而达到熟悉JQuery的目的

    jQuery基础选择器练习题

    JQ 选择器大全包含:基本选择器,层级选择器,层级函数,过滤选择器,内容选择器,可见选择器,jq中显示相关的函数,属性选择器,子元素选择器,表单选择器。里面的练习题可以拿来练手

    jquery选择器练习[归类].pdf

    jquery选择器练习[归类].pdf

    jquery一些案列和一些选择器

    关于一些jquery的初步案例和几个选择器 初级。

    jQuery选择器上机练习题及答案.rar

    (24)选择表格中第3行,标题行不算(要求用nth-child()过滤器) 上机任务3 用chrome打开dom.sample2.html页面,该页面中内嵌有几个CSS类:.red .green .blue .yellow .thickBorder .seeThrough 在chrome的控制台...

    jqurey选择器练习

    选择器是jqurey最强大的一个方面,压缩包中有详细的练习的例子。

    JQuery使用练习

    本练习简单涉及到了JQuery选择器、事件、文档处理、函数、属性的使用

    jQuery练习

    1:导航菜单弹出二级菜单 博文链接:https://justsee.iteye.com/blog/798405

    JQuery 选择器、DOM节点操作练习实例

    下面小编就为大家带来一篇JQuery 选择器、DOM节点操作练习实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    jquerydemo

    12. 选择器练习 13. 创建和插入节点 14. 重写 JS 实验之分类添加内容 15. 删除及清空节点 16. 重写 JS 实验之员工管理 17. 克隆和替换节点 18. 包裹节点 19. html() 方法 & val() 方法 20. 小结2 21. CSS DOM 操作 ...

    JQuery选择器、过滤器大整理

    主要介绍了JQuery选择器、过滤器大整理,经过一晚上的查找整理,终于整理出一套应该算最全面的JQuery选择过滤器的方法了,需要的朋友可以参考下

    JQuery练习集合

    JQuery练习集合 包括:节点遍历、节点替换、链式编程、链式each、选择过滤器、相对选择器、球队选择、属性选择器等等例子

    尚硅谷jQuery视频教程(25集)

    教程名称:尚硅谷jQuery视频教程(25集)课程目录:【】1....尚硅谷_佟刚_jQuery_选择器的练习【】13.尚硅谷_佟刚_jQuery_创建节点及插入节点【】14.尚硅谷_ 资源太大,传百度网盘了,链接在附件中,有需要的同学自取。

    JQuery选择器

    JQuery选择器 几个小练习 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; ; charset=utf-8" /&gt; &lt;title&gt;2-12 &lt;!-- 引入jQuery -...

    【JavaScript源代码】JavaScript与JQuery框架基础入门教程.docx

     目录 一,JS对象二,DOM–1,作用–2,测试三,Jquery–1,概述–2,使用步骤–3,入门案例–4,jQuery的文档就绪四,JQuery的语法–1,选择器–2,常用函数–3,常用事件–4,练习总结 一,JS对象 二,DOM –1,...

    jQuery 练习[二] jquery 对象选择器(1)

    根据 id 选择(通过 id 只能选择一个对象), 如: $("#div2") ,jquery 对象选择器是jquery的一个亮点。

    锋利的jquery

    读者可以系统地掌握jQuery的选择器、DOM操作、事件和动画、AJAX应用、插件、jQuery Mobile、jQuery各个版本变化、jQuery性能优化和技巧等知识点,并结合每个章节后面的案例演示进行练习,达到掌握核心知识点的目的。...

    jQuery基本过滤选择器用法示例

    主要介绍了jQuery基本过滤选择器用法,结合实例形式分析了jQuery中:first、:last、:not、:even、:odd、:eq、:gt等基本过滤选择器的使用方法,需要的朋友可以参考下

    《锋利的jQuery》(高清扫描版-有书签).

    读者可以系统地掌握jQuery的选择器、DOM操作、事件和动画、AJAX应用、插件、jQuery Mobile、jQuery各个版本变化、jQuery性能优化和技巧等知识点,并结合每个章节后面的案例演示进行练习,达到掌握核心知识点的目的。...

Global site tag (gtag.js) - Google Analytics