复习jQuery常用知识点

jQuery不需要考虑太多兼容性问题

页面加载方法

记得引入jQuery文件，否则 $ 符号会识别不了
引入jQuery文件的script标签，不能写代码，否则会没作用

	<script src="jquery-1.12.2.js"></script>
	<script type="text/javascript">

		//页面中基本标签加载后就执行
		jQuery(function(){
			console.log('jQuery');
		});
		//页面中的基本标签加载完毕后就可以触发
		$(document).ready(function(){
			console.log('wao');
		});
		$(function(){
			console.log("$");
		});


		//页面中所有的内容加载完毕后才触发，标签，图片，文字内容……
		$(window).load(function(){
			console.log("yes,i'm here");
		});

	</script>

jQuery对象与DOM对象的转化

			/* 将jQuery对象转为DOM对象
			$(btnObj).get(0);---->DOM对象
			$(btnObj)[0];
			将DOM对象转为jQuery对象只需要将DOM对象放在$(domObj)
			*/

获取对象

		/*
		DOM中获取元素的方式：
			document.getElementById("id值");根据id，一个
			document.getElementsByName("标签名字");根据标签的名字，多个
			document.getElementsByName("name属性值");根据name属性的值，多个
			document.getElementsByClassName("类样式的名字");多个
		jQuery对象获取（常用）：
			// $('#id值');一个
			// $("标签的名字");多个
			// $(".类样式的名字");多个
		*/

jQuery常用选择器

常用方法

				.html() 方法，设置元素中间显示其他元素及内容，类似innerHTML
				.text() 方法，设置元素中间的文本内容，类似innerText
				.val() 方法，设置input元素中的value值，类似value
				.css({"key":"value"}) 方法，设置元素的样式，类似style，backgroundColor

				.attr(attribute) 方法用于获取属性的值
				.attr(attr,value) 方法可修改匹配属性的值
				.removeAttr() 方法从被选元素中移除一个或多个属性，多个用空格分开

				//下面四种可以添加新元素，多个参数用逗号隔开
				用法：
				// var obj = $("<p> 添加了p </p>");
				// $("div").append(obj);
				//另一种主动方法：obj.appendTo($("div));
				.append() 方法在所选元素的子末尾插入内容
				.prepend() 方法在所选元素的子开头插入内容
				.before() 方法在所选元素之前插入指定内容
				.after() 方法在被选元素之后插入指定内容
				.html("标签代码")
				//js中的添加元素的方法
				1.document.write("标签code"); 缺陷：页面加载后创建元素，会把页面中原有的内容全部干掉
				2.innerHTML
				3.document.createElement("标签code");

				//下面四种对类进行操作，多个用空格分隔
				.addClass() 向被选元素添加一个或多个类
				.removeClass() 从被选元素中删除一个或多个类，没规定参数，就删除所有类
				.toggleClass() 对被选元素进行添加/删除类的切换操作

				//DOM遍历
				// 1.向上遍历DOM树
				.parent() 方法返回被选元素的直接父元素
				.parents() 返回被选元素的所有祖先元素
				// 2.向下遍历DOM树
				.children() 返回被选元素的所有直接子元素
				.find() 返回被选元素的后代元素
				// 3.水平遍历DOM树
				.siblings() 返回被选元素的所有兄弟
				.next() 返回被选元素的下一个兄弟
				.nextAll() 返回被选元素的后面的所有兄弟
				.prev() 返回被选元素的上一个兄弟
				.prevAll() 返回被选元素的前面的所有兄弟

				//删除元素
				.remove() 删除被选元素及其孩子
				.empty() 删除被选元素的孩子

				// 事件处理
				// 1.鼠标事件 用法：.click(function(){})
				click :单击事件
				dblclick :双击事件
				mouseenter :当鼠标指针进入所选元素时触发
				mouseleave :当鼠标离开所选元素时触发
				mouseover :当鼠标在所选元素上方悬停时触发

				// 2.键盘事件
				keydown :当按下键盘按键时会触发
				keyup :当按键被释放时会触发
				keypress :当按下并抬起同一个按键会触发

				// 3.表单事件
				submit :提交表单时会触发
				change :当表单元素的值发生改变时会触发
				focus :当表单元素获得焦点时触发
				blur :当表单元素失去焦点时会触发

				// 4.文件事件 
				ready :当DOM加载完成以后触发
				resize :当浏览器窗口大小改变时触发
				scroll :当用户在指定的元素中滚动滚轮条时触发

				// 5. on()
				用法：.on("上面的事件名称",function(){});
				多个事件名称用空格隔开

				// 6. off()
				用法 .off("指定事件名称")
				作用：删除被选元素的指定事件

				// 事件对象,例如 ,click(function(event){});
				event.type :可获取事件类型
				event.pageX 和 event.pageY :获取鼠标当前相当于页面的坐标（X，Y）
				event.preventDefault() :阻止默认行为
				event.stopPropagation() :阻止事件冒泡
				event.which :获取鼠标单击时按下的是哪个键
				event.data :数据绑定事件时传入的任何数据
				event.currentTarget :在实践中冒泡过程中当前的DOM元素
				event.result :包含由被指定事件触发的事件处理器返回的最后一个值

				// 显示隐藏、淡入淡出、滑动
				// 参数1:毫秒单位 参数2:回调函数，可选
				// 例如：.hide(1000,function(){});
				.hide() :隐藏被选元素
				.show() :显示被选元素
				.toggle() :隐藏和显示之间切换

				.fadeIn() :淡入被选元素
				.fadeOut() :淡出被选元素
				.fadeToggle() :淡入淡出切换

				.slideUp() :上滑动被选元素
				.slideDown() :下滑动被选元素
				.slideToggle() :上下滑动切换

				// 动画
				.animate({width:'',height:''},speed,function(){})
				参数1：属性值可像上面的写法，但建议json格式的参数
				speed: 毫秒
				第三个参数：是回调函数 [可选]

				// 动画队列
				.animate({height: '+=300px', width: '+=100px'}, 500);
                .animate({height: '-=100px', width: '-=300px'}, 500);
                .animate({height: '+=300px', width: '+=100px'}, 500);
                像这种，jQuery会创建一个“内部”队列，按顺序依次执行

				// .stop(stopAll, goToEnd)
				stopAll :清除动画队列，默认false：仅停止当前活动的动画，如许后面的动画执行，[可选]
				goToEnd() :是否立即完成当前动画，默认false

链式编程

				// $('.cls').html(str);
				// $(".cls").css({'backgroundColor':'red'});
				$('.cls').prepend(str).css({'backgroundColor':'red'});
				//这样就是一个链式编程，但前提调用完之后返回来的还是一个对象