`
lhgyy00
  • 浏览: 144318 次
  • 性别: Icon_minigender_2
  • 来自: 北京
社区版块
存档分类
最新评论

jquery学习笔记--1

阅读更多
/**
$(document).ready(function() {
/*
//$("#orderedlist").addClass("red");//背景色变红
//$("#orderedlist>li").addClass("blue");//字变蓝
$("#orderedlist li:last").hover(function(){//hover是获得焦点的意思
			$(this).addClass("green");//字变绿
		},function(){
			$(this).removeClass("green");
		});
*/
/*选择器练习2
$("#orderedlist").find("li").each(function(i){//找到id=“orderedlist”的dom下的name=“li”的dom
		$(this).html($(this).html()+"  BAM"+i);//each(参数)函数单座参数传递
	})//每一个的字后面加东西*/
/*
$("#reset").click(function(){//查找id=‘reset’的按钮,加事件click
		$("#form")[0].reset();	//查找id=‘form’的第一个表单reset
	})*/
/**选择器练习3---多个表单的reset方法
$("#reset").click(function(){
	$("form").each(function(){//如果改成“#form”则只能reset第一个form不太明白
			this.reset();
		})
	/**练习--过滤(1)filter是过滤表达式后符合条件的,(2)not得到不在**条件的**/
/***	$("li").not("[ul]").css("border","1px solid black");//div中排除子元素是ul的添加css样式
*/	
//$("a[@name]").background("eee");//选择连接带name属性的元素的集合
//$("a[@href*=/content/gallery]").click(function(){//href*不懂是什么意思
//		alert("jquery test");
//	})
/**查找前后的元素
$('#faq').find('dd').hide().end().find('dt').click(function(){
	var answer = $(this).next();//当前元素的下一个元素
	if(answer.is(':visible')){//end是得到上一次选择操作的集合也就是说第一次不执行第2次才执行
		answer.slideUp();//收起
	}else{
		answer.slideDown();//展开
	}//第一次的时候怎么让这些dd都隐藏的呢?
	})**/
/**选择父元素**/
/*$("a").hover(function(){
		$(this).parents("p").addClass("highlight");//为什么执行完成后p块不见了?
	},function(){
		$(this).parents("p").remove("highlight")})
});
*/
/**
$(function(){//jquery的简写形式--好用
	$("a").click(function(){
			alert("hello World")
		})
})

**/
/**使用Ajax
$(document).ready(function(){//取出的结果都为空
	var ratingMarkup = ["please rate:"];//定义变量
	for(var i =1;i<=5;i++){
		ratingMarkup[ratingMarkup.length]="<a href='#'>"+i+"</a>";
	}
	$("#rating").append(ratingMarkup.join('')).find("a").click(function(e){
		e.preventDefault();
		$.post("rate.php",{rating:$(this).html()},function(xml){
			var result = ["Thanks for rating,current average:",
				$("average",xml).text(),
				",number of votes:",$("count",xml).text()]
		$("#rating").html(result.join(''))
				})
		})
})
**/
/**简写形式添加事件
$(function(){/**这个没怎么看懂。。。。
	var addClickHandlers=function(){
	$("a.clickMeToLoadContent").click(function(){
		$("#target").load(this.href,addClickHandlers);
		alert("sss")
	});addClickHandler();}
})**/
/**特效---展开、收起
$(function(){
	$("a").toggle(function(){//开关
			$(".stuff").hide('slow');//慢慢隐藏
		},function(){
			$(".stuff").show('fast');//快速收起
	})
})**/
/**混合特效---什么也没看出来。。。
$(document).ready(function(){
	$("a").toggle(function(){
			$(".stuff").animate({
					height:'hide',
					opacrity:'hide'
				},'slow');
			$(".stuff").animate({
					height:'show',
					opacity:'show'
				},'slow');
			
		})
})**/
/**添加排序
$(document).ready(function(){//<script src="lib/jquery.tablesorter.js" type="text/javascript"></script>
	$("#large").tableSorter();
});**/
/**排序奇偶行显示
$(document).ready(function(){
	$("#large").tableSorter({
			stripingRowClass:['odd','even'],//奇偶行的class的名称
			stripRowsOnstartUp:true//初始化的行的class
		})
});
**/
分享到:
评论

相关推荐

    jquery学习笔记-相关代码

    **jQuery学习笔记** jQuery是一个广泛使用的JavaScript库,它极大地简化了HTML文档遍历、事件处理、动画和Ajax交互。这份笔记旨在深入理解jQuery的核心概念,通过实例代码来加强理解和应用。 1. **jQuery选择器**:...

    Jquery学习笔记-2009Juery年度插件之galleria

    **jQuery学习笔记——2009年jQuery年度插件之Galleria** Galleria是一款功能强大的JavaScript图像画廊插件,它在2009年因其出色的设计和丰富的功能而备受关注。这款插件充分利用了jQuery库的强大性能,使得在网页上...

    jquery-ui-1.7.1.custom.css 自家博客专用

    博客专用: Jqgrid学习笔记__01__初来乍到 很多时候在网上下载一段代码,结果引用的CSS和JS文件不知道从哪里弄,结果上网下载,不是版本不对,就是完全不对。这里的CSS是有对应的代码段的。请参考博客 ====&gt; Jqgrid...

    jQuery 语法学习笔记

    jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery 语法学习笔记jQuery ...

    Jquery学习笔记Jquery学习笔记

    Jquery学习笔记 Jquery学习笔记是指使用Jquery框架来实现javascript编程的笔记记录,本笔记记录了Jquery-1.2的基本用法、Ajax异步交互、XMLHttpRequest对象的基本应用等知识点。 一、Jquery基本用法 Jquery是一个...

    jQuery学习笔记(一)

    **jQuery学习笔记(一)** 在深入探讨jQuery之前,我们首先要理解什么是jQuery。jQuery是一个高效、易用且功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互等任务。由John Resig在2006...

    jquery 学习笔记总结

    **jQuery 学习笔记总结** jQuery 是一个广泛使用的 JavaScript 库,它简化了网页文档对象模型(DOM)操作、事件处理、动画制作以及Ajax交互。本篇笔记将深入探讨 jQuery 的核心概念,包括选择器、常用方法以及在...

    锋利的JQuery学习笔记.pdf

    锋利的JQuery学习笔记

    jquery 学习笔记源码 1-3章

    《jQuery学习笔记源码1-3章》涵盖了jQuery的基础到进阶内容,是初学者深入理解这一强大JavaScript库的关键步骤。jQuery是一个轻量级、高性能的JavaScript库,它简化了HTML文档遍历、事件处理、动画设计和Ajax交互。...

    jquery 学习笔记

    **jQuery学习笔记** jQuery,作为一个轻量级的JavaScript库,极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。这篇学习笔记将深入探讨jQuery的核心概念和实用技巧,帮助初学者快速上手。 ## 一...

    韩顺平jquery学习笔记及练习

    《韩顺平jQuery学习笔记及练习》是一份珍贵的学习资源,由知名讲师韩顺平的课程实录整理而成,旨在帮助学习者深入理解和掌握jQuery这一强大的JavaScript库。jQuery简化了HTML文档遍历、事件处理、动画设计和Ajax交互...

    AJAX学习笔记----jquery+servlet实现用户名验证

    NULL 博文链接:https://persistc.iteye.com/blog/264072

    jquery-1.3.1-vsdoc.rar

    - 选择器:jQuery支持CSS1至CSS3的选择器,如$("#id")选取ID为id的元素,$(".class")选取所有class为class的元素。 - DOM操作:如$(selector).html()用于设置或获取元素的HTML内容,$(selector).append()用于在元素...

    javascript and jquery学习笔记与资料

    这里,我们有针对这两个主题的学习笔记和参考资料,包括JavaScript培训、jQuery API、JavaScript基础、函数详解以及jQuery使用手册等内容。让我们逐一探讨这些知识点。 首先,`JavaScript培训.zip`可能包含的是对...

    jquery学习笔记.rar

    《jQuery学习笔记详解》 jQuery,作为一款广泛应用于前端开发的JavaScript库,因其简洁的语法和强大的功能,深受开发者喜爱。这份"jQuery学习笔记.rar"包含的资源旨在帮助你全面掌握jQuery,无论你是初学者还是有...

Global site tag (gtag.js) - Google Analytics