[知了堂学习笔记]_jQuery入门

**

知了堂学习笔记–JQuery入门(上部分)

什么是JQuery?
jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。总结起来就是3个方面（1.jQuery 是一个 JavaScript 库。2.jQuery 极大地简化了 JavaScript 编程。3.jQuery 很容易学习。）

**
2.JQuery能做什么？
- 快速获取文档元素
- 提供漂亮的页面动态效果
- 创建AJAX无刷新网页
- 提供对JavaScript语言的增强
- 增强的事件处理
- 更改网页内容
3.第一次JQuery程序

<html>
<head>
<script src="jquery-1.11.0.min.js"></script>//加载jquery函数包
<script>
$(function(){
$("div").hide(3000);//找到所有div标签并使div3秒内隐藏
});
</script>
<style>
	div{width: 100px;
		height: 100px;
		border: 1px solid blue;
	}
</style>
</head>
<body>
<div></div>
<div></div>
</body>
</html>

4.JQuery选择器

1.JQuery 基本选择器

id选择器：$("#id"),例如: $("#aaa")找到id=aaa的div
类选择器：$("#name"),例如: $(".aaa")找到name=aaa的div
标签选择器：$(“div”),例如: $(“div”)找到所有div
群组选择器：$(“div,#id,.name”),这个是把div #id .name三个都找到

2.JQuery层次选择器

选择直接子元素：$(“div>#aaa”) 选择div下面id=aaa的元素
选择所有后代子元素:$(“div #aaa”)
选择直接兄弟元素：$(“div + #aaa”) 选择同时位于div下面id=aaa的元素的下一个元素（向下找）
选择所有兄弟元素：$(“div ` #aaa”)

3.JQuery过滤选择器

$(“div:first/last”)选择第一个(最后一个)div元素
$(“div:not(#001)”)选择id不为001的div元素
$(“div:even/odd”)选择索引为偶数（奇数）的div元素
$(“div:eq(2)”)选择索引为2的div元素
$(“div:gt(6)”)选择索引大于6的div元素
$(“div:lt(3)”)选择索引小鱼3的div元素

4.JQuery内容选择器

$("#div:contains(‘good’)")选择文本内容为good的div元素
$("#div:empty")选择里面不含元素的div元素
$("#div:has(h1)")选择里面含有h1标签的div元素
$("#div:parent")选择拥有子元素的div元素

5.JQuery参考属性图
[知了堂学习笔记]_jQuery入门