我所认知的jQuery

笔记放在Github上，点击访问下载

---

jQuery是一个优秀的JavaScript库

---

jQuery的特性：

1. HTML元素的获取和操作
2. CSS的操作
3. HTML事件函数
4. JavaScript的特效动画
5. HTMLDOM的遍历与修改
6. AJAX
7. Utilities

---

jQuery的优势及特点：

1. 轻量级
2. 强大的选择器
3. 出色的DOM操作的封装
4. 可靠地事件处理机制
5. 完善的Ajax
6. 不污染顶级变量
7. 出色的浏览器兼容性
8. 链式操作方式
9. 隐式迭代
10. 行为层与结构层的分离
11. 丰富的插件支持
12. 完善的文档
13. 开源

---

jQuery入口函数的种类：

//第一种
$(document).ready(function(){});
//第二种
jQuery(document).ready(function(){});
//第三种
$(function(){});
//第四种
jQuery(function(){});

---

jQuery的冲突问题：

如果引入的其他库让$失效，需要释放$的使用权

jQuery.noConflict();
jQuery(function(){
	alert(1);
});
//或者指定一个变量代替$
var no = jQuery.noConflict();
no(function(){
	alert(1);
});

---

jQuery函数的参数类型

1. 匿名函数
   $(function(){ });当文档结构加载完毕之后jQuery函数调用匿名函数。
2. 选择器(字符串)
   jQuery函数通过该选择器获取对应的DOM，然后将这些DOM封装到一个jQuery对象中并返回。
3. HTML字符串
   $("<div class='one'>one<div>"); jQuery函数会根据传入的文本创建好HTML元素并封装成jQuery对象返回。
4. DOM节点
   $(document.body) jQuery函数将该DOM节点封装成jQuery对象并返回。

---

DOM对象与jQuery对象的转换

1. DOM对象->jQuery对象
   var $dom = $(dom); dom为一个DOM对象，$dom为jQuery对象
2. jQuery对象->DOM对象
   var dom = $(".one")[0]

---

将checkbox选择的value值保存到数组中：

$(function(){	
	$("form :checkbox").click(function(event){
		var arr = [];	
		var $result = $("form :checkbox:checked");
		// console.log($result);
		//1.获取内部DOM，获取DOM对应的value属性值
		for(var i=0;i<$result.length;i++){
			arr.push($result[i].value);
		}
		console.log(arr);
		//2.将result转成数组，再映射出value属性
		/*var result = Array.prototype.slice.call($result);
		arr = result.map(function(item){
			return item.value;
		});*/
		// console.log(arr);
		//3.可以使用jQuery对象提供的map方法，将value映射出来
		/*$arr = $result.map(function(index,item){
			// return item.value;
			return $(item).val();
		});
		arr = Array.prototype.slice.call($arr);*/
		// console.log(arr);
	});
});

jQuery计算1-100的累加

//计算1-100的累加
var arr = [];
for(var i=1;i<=100;i++){
	arr.push(i);
}
var $arr = $(arr);
var num = 0;
$arr.each(function(index,item){
	num += item;
});
console.log(num);