JQuery

JQuery简介

1.JQuery是一个JavaScript函数库
2.核心理念：write less, do more（写得更少，做得更多）
3.JQuery库主要功能有HTML元素选取、HTML元素操作、CSS操作、HTML事件函数、JS特效和动画、HTML DOM遍历和修改等
4.需要导包

<script type="text/jscript" src="../js/jquery-1.11.0.js"></script>

5.对象
对象获取（基本语法：JQuery(选择器)或$(选择器)）对象名建议以$开头。
例如：$("vid");

基本操作

1.加载

与window.onload函数类似。先于window.onload加载，可以加载多次。（window.onload只加载一次，且只加载最后一次）。提供ready()函数。

2.基本选择器

（1）基本选择器

1.标签选择器
    		alert($("input").length);
		2.id选择器
		 	alert($("#rd1").size());
		3.class选择器
			alert($(".hobby").length);

（2）层级选择器
例子：（只是一部分）

（3）基本过滤选择器
：first 第一个
：last 最后一个
：not(…) 删除指定内容。1234：not(3)–>124
: even 偶数
；odd奇数
：eq(index)指定第几个
：gt(index)大于n个 >
: it(index)小于n个 <
: header 获得标题（

/

…）;
: animated 获得动画的
：focus 获得焦点

//$("tr:odd").css("background-color","greenyellow");

(4)属性选择器
[属性名] 获得有属性名的元素
[属性名=值] 获得属性名等于值的元素
[属性名！=值]不等于值的元素
[属性名^=值]获得姓名以值开头元素
[属性名$=值]获得属姓名结尾元素
[属性名*=值]获得姓名含有值元素

(5)常用事件

3效果切换

1.显示跟隐藏

heid（）和show（）方法来显示隐藏

$(function(){
				$("#show").click(function(){
					$("p").show('slow');//隐藏
				})
				$("#hide").click(function(){
					$("p").hide('fast');
				})
				$("#toggle").click(function(){
					//点击一次隐藏，再次点击出现
					$("p").toggle(3000); //事件是消失跟出现的时间，有动态效果
				})
			});

可选的 speed 参数规定隐藏/显示的速度，可以取以下值：“slow”、“fast” 或毫秒。

2.淡入淡出

fadeIn() 用于淡入已隐藏的元素；fadeOut() 方法用于淡出可见元素； fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换
fadeTo() 方法允许渐变为给定的不透明度（值介于 0 与 1 之间）
!
在这里插入图片描述

4 JQuery操作HTML

（1）。获取/设置内容-text()、html()及val()

	text() - 设置或返回所选元素的文本内容
	html() - 设置或返回所选元素的内容（包括 HTML 标记）
	val() - 设置或返回表单字段的值
	$("#text").text();
	$("#text").val();

（2）。获取/设置属性-attr()、prop()

	对于 HTML 元素本身就带有的固有属性，在处理时，使用 prop 方法;对于 HTML 元素我们自己自定义的 DOM 属性，在处理时，使用 attr 方法。

!
设置属性就是直接获取属性后，在里面传值就可以了。

（3）。添加和删除元素

	append() - 在被选元素的结尾插入内容
	prepend() - 在被选元素的开头插入内容
	after() - 在被选元素之后插入内容
	before() - 在被选元素之前插入内容


	删除元素
	remove() - 删除被选元素（及其子元素）
	empty() - 从被选元素中删除子元素

###（4）获取并设置CSS类
addClass() - 向被选元素添加一个或多个类
removeClass() - 从被选元素删除一个或多个类
toggleClass() - 对被选元素进行添加/删除类的切换操作
css() - 设置或返回样式属性

以上为初学总结，有错误，望指出！！！