jQuery 是一个 JavaScript 库。

JQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
jQuery 库可以通过一行简单的标记被添加到网页中。
jQuery是一个JavaScript函数库。
jQuery是一个轻量级的"写的少，做的多"的JavaScript库。
jQuery库包含以下功能：
1、html，的元素选取
2、html的，元素操作
3、html dom，遍历和修改
4、js，特效和动画效果
5、css，操作
6、html，事件操作
7、ajax，异步请求方式
http:/ /www.iis7.com/
提示： 除此之外，Jquery还提供了大量的插件。
::::::::::::::::::::::
jQuery 语法
通过 jQuery，您可以选取（查询，query） HTML 元素，并对它们执行"操作"（actions）。
jQuery 语法是通过选取 HTML 元素，并对选取的元素执行某些操作。
基础语法： $(selector(选择器)).(行为)action()
美元符号定义 jQuery
选择符（selector）"查询"和"查找" HTML 元素
jQuery 的 action() 执行对元素的操作
jQuery 使用的语法是 XPath 与 CSS 选择器语法的组合。
:::::::::::::::::::::::
文档就绪事件
您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中，这是为了防止文档在完全加载（就绪）之前运行 jQuery 代码，即在 DOM 加载完成后才可以对 DOM 进行操作。
两种写法：

1. $(document).ready(function(){
   // 开始写 jQuery 代码...
   });
2. 简写 $(function(){
   // 开始写 jQuery 代码...
   });
   如果在文档没有完全加载之前就运行函数，操作可能失败。
   :::::::::::::::::::::::::
   jQuery 选择器
   jQuery 选择器允许您对 HTML 元素组或单个元素进行操作。
   jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择）HTML 元素。 它基于已经存在的 CSS 选择器，除此之外，它还有一些自定义的选择器。
   jQuery 中所有选择器都以美元符号开头：$()。
   jQuery 元素选择器基于元素名选取元素。
   ...................
   #id 选择器
   jQuery #id 选择器通过 HTML 元素的 id 属性选取指定的元素。
   页面中元素的 id 应该是唯一的，所以您要在页面中选取唯一的元素需要通过 #id 选择器。
   通过 id 选取元素语法如右侧所示：$("#test")
   .................
   .class 选择器
   jQuery 类选择器可以通过指定的 class 查找元素。
   语法如右侧所示：$(".test")
   ...........................
   $("*")，选取所有元素
   $(this)，选取当前 HTML 元素
   $("p.intro")，选取 class 为 intro 的

   元素
   $("p:first")，选取第一个

   元素
   $("ul li:first")，选取第一个

   元素的第一个
   • 元素
     $("ul li:first-child")，选取每个
     元素的第一个
     • 元素
       $("[href]")，选取带有 href 属性的元素
       $("a[target='_blank']")，选取所有 target 属性值等于 "_blank" 的 元素
       $("a[target!='_blank']")，选取所有 target 属性值不等于 "_blank" 的 元素
       $(":button")，选取所有 type="button" 的 元素 和 元素
       $("tr:even")，选取偶数位置的 元素
       $("tr:odd")，选取奇数位置的 元素
       ::::::::::::::::::::::::::::::::::::::::::::::::::
       独立文件中使用 jQuery 函数，如果您的网站包含许多页面，并且您希望您的 jQuery 函数易于维护，那么请把您的 jQuery 函数放到独立的 .js 文件中。
       :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 事件
       jQuery 是为事件处理特别设计的。
       页面对不同访问者的响应叫做事件。
       事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。
       实例：
       在元素上移动鼠标。
       选取单选按钮
       点击元素
       在事件中经常使用术语"触发"（或"激发"）例如： "当您按下按键时触发 keypress(按键响应) 事件"。
       常见 DOM 事件：
       鼠标事件：
       click(单击)
       dblclick(双击鼠标)
       mouseenter(鼠标移入)，mouseleave(鼠标移出)
       mousedown(按下鼠标按键)，mouseup(松开鼠标按钮)
       hover()方法用于模拟光标悬停事件，当鼠标移动到元素上时，会触发指定的第一个函数(mouseenter)，当鼠标移出这个元素时，会触发指定的第二个函数(mouseleave)。
       键盘事件：keypress(按键响应)，keydown(按键按下)，keyup(按键恢复)
       表单事件：submit(提交)，change(更换)，focus(焦点)， blur(失去焦点)
       文档/窗口事件： load(负荷)，resize(调整尺寸)， scroll(文本框中的起始滚动行)， unload(卸载)
       fadeOut(淡出时间)
       在 jQuery 中，大多数 DOM 事件都有一个等效的 jQuery 方法。
       $(document).ready() 方法允许我们在文档完全加载完后执行函数。
       ::::::::::::::::::::::::::::::::::::::::::::
       jQuery 效果- 隐藏和显示
       隐藏、显示、切换，滑动，淡入淡出，以及动画。
       slow(缓慢的)，可用作动作时间。
       。。。。。。。。。。。。。。。。。。
       jQuery hide(spaad) 和 show(spaad)：
       通过 jQuery，您可以使用 "hide(隐藏)" 和 "show(显示)" 方法来隐藏和显示 HTML 元素。
       speed 参数规定隐藏/显示的速度，可以取以下值："slow(缓慢的)"、"fast(快速的)" 或毫秒，可选的 callback 参数是隐藏或显示完成后所执行的函数名称。
       。。。。。。。。。。。
       jQuery toggle(切换)：
       通过 jQuery，您可以使用 toggle() 方法来切换 hide() 和 show() 方法。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 效果 - 淡入淡出
       通过 jQuery，您可以实现元素的淡入淡出效果。
       jQuery 拥有下面四种 fade 方法：
       fadeIn()，用于淡入已隐藏的元素。
       fadeOut()，用于淡出显示的元素。
       fadeToggle()，可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
       fadeTo()，允许渐变为给定的不透明度（值介于 0 与 1 之间）。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 效果 - 滑动
       通过 jQuery，您可以在元素上创建滑动效果。
       jQuery 拥有以下滑动方法：
       slideDown()，用于向下滑动元素。
       slideUp()，用于向上滑动元素。
       slideToggle()，可以在 slideDown() 与 slideUp() 方法之间进行切换。如果元素向下滑动，则 slideToggle() 可向上滑动它们。如果元素向上滑动，则 slideToggle() 可向下滑动它们。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 效果- 动画
       jQuery animate() 方法允许您创建自定义的动画。
       语法：$(selector).animate({params},speed,callback)，必需的 params 参数定义形成动画的 CSS 属性。
       默认情况下，所有 HTML 元素都有一个静态位置，且无法移动，如需对位置进行操作，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！
       jQuery animate() - 使用相对值，也可以定义相对值（该值相对于元素的当前值）。需要在值的前面加上 "+=" 或 "-=" 。
       jQuery animate() - 使用预定义的值，您也可以把属性的动画值设置为 "show"、"hide" 或 "toggle" 。
       jQuery animate() - 使用队列功能，默认地，jQuery 提供针对动画的队列功能。
       这意味着如果您在彼此之后编写多个 animate() 调用，jQuery 会创建包含这些方法调用的"内部"队列。然后逐一运行这些 animate 调用。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 停止动画
       jQuery stop() 方法用于在动画或效果完成前对它们进行停止。
       jQuery stop() 方法，jQuery stop() 方法用于停止动画或效果，在它们完成之前，stop() 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。
       语法：$(selector).stop(stopAll,goToEnd);
       可选的 stopAll 参数规定是否应该清除动画队列。默认是 false，即仅停止活动的动画，允许任何排入队列的动画向后执行。
       可选的 goToEnd 参数规定是否立即完成当前动画。默认是 false。
       因此，默认地，stop() 会清除在被选元素上指定的当前动画。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery Callback(回调函数) 方法
       Callback 函数在当前动画 100% 完成之后执行。
       许多 jQuery 函数涉及动画。这些函数也许会将 speed 或 duration 作为可选参数。
       例子：$("p").hide("slow")
       speed 或 duration 参数可以设置许多不同的值，比如 "slow", "fast", "normal" 或毫秒。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - 链(Chaining)
       通过 jQuery，可以把动作/方法链接在一起。
       Chaining 允许我们在一条语句中运行多个 jQuery 方法（在相同的元素上）。
       jQuery 方法链接：直到现在，我们都是一次写一条 jQuery 语句（一条接着另一条）。
       不过，有一种名为链接（chaining）的技术，允许我们在相同的元素上运行多条 jQuery 命令，一条接着另一条。
       提示： 这样的话，浏览器就不必多次查找相同的元素。
       如需链接一个动作，您只需简单地把该动作追加到之前的动作上。
       如果需要，我们也可以添加多个方法调用。
       提示：当进行链接时，代码行会变得很长。不过，jQuery 语法不是很严格；您可以按照希望的格式来写，包含换行和缩进。
       jQuery 会抛掉多余的空格，并当成一行长代码来执行上面的代码行。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - 获取内容和属性
       jQuery 拥有可操作 HTML 元素和属性的强大方法。
       jQuery DOM 操作：
       jQuery 中非常重要的部分，就是操作 DOM 的能力，jQuery 提供一系列与 DOM 相关的方法，这使访问和操作元素和属性变得很容易。
       DOM = Document Object Model（文档对象模型）
       DOM 定义访问 HTML 和 XML 文档的标准："W3C 文档对象模型独立于平台和语言的界面，允许程序和脚本动态访问和更新文档的内容、结构以及样式"。
       获得内容 - text()、html() 和 val()：
       三个简单实用的用于 DOM 操作的 jQuery 方法：
       text() - 设置或返回所选元素的文本内容
       html() - 设置或返回所选元素的内容（包括 HTML 标记）
       val() - 设置或返回表单字段的值
       attr("要获取的属性") - 方法用于获取属性值
       :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - 设置内容和属性
       设置内容 - text()、html() 和 val()
       text() - 设置或返回所选元素的文本内容
       html() - 设置或返回所选元素的内容（包括 HTML 标记）
       val() - 设置或返回表单字段的值
       。。。。。。。。。。。。。。。。。。
       text()、html() 以及 val() 的回调函数：
       text()、html() 以及 val()，同样拥有回调函数。回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
       attr() 方法也用于设置/改变属性值。attr() 方法也允许您同时设置多个属性。
       attr()，也提供回调函数。回调函数有两个参数：被选元素列表中当前元素的下标，以及原始（旧的）值。然后以函数新值返回您希望使用的字符串。
       :::::::::::::::::::::::::::::::::
       jQuery - 添加元素
       通过 jQuery，可以很容易地添加新元素/内容。
       添加新内容的四个 jQuery 方法：
       append() - 在被选元素的结尾插入内容，（仍然该元素的内部），可无限追加。
       prepend() - 在被选元素的开头插入内容，可无限追加。
       after() - 在被选元素之后插入内容
       before() - 在被选元素之前插入内容
       :::::::::::::::::::::::::::::::::
       jQuery - 删除元素
       通过 jQuery，可以很容易地删除已有的 HTML 元素。
       可使用以下两个 jQuery 方法：
       remove() - 删除被选元素（及其子元素），remove() 方法也可接受一个参数，允许您对被删元素进行过滤，该参数可以是任何 jQuery 选择器的语法。
       empty() - 从被选元素中删除子元素
       :::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - 获取并设置 CSS 类
       通过 jQuery，可以很容易地对 CSS 元素进行操作。
       jQuery 拥有若干进行 CSS 操作的方法：
       addClass() - 向被选元素添加一个或多个类
       removeClass() - 从被选元素删除一个或多个类
       toggleClass() - 对addClass()和removeClass() 的切换
       。。。。。。。。
       jQuery css() 方法
       css() - 设置或返回被选元素的一个或多个样式属性
       如需返回指定的 CSS 属性的值，请使用如右所示语法：css("(属性名)propertyname")。
       如需设置指定的 CSS 属性，请使用如右所示语法：css("(属性名)propertyname","(值)value")。
       如需设置多个 CSS 属性，请使用如下语法：css({"propertyname":"value","propertyname":"value",...})。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 尺寸
       通过 jQuery，很容易处理元素和浏览器窗口的尺寸。
       jQuery 提供多个处理尺寸的重要方法：
       width()
       height()
       innerWidth()
       innerHeight()
       outerWidth()
       outerHeight()
       。。。。。。。。。。。。。。。。
       jQuery width() 和 height() 方法：
       width() 方法设置或返回元素的宽度（不包括内边距，边框或外边距）。
       height() 方法设置或返回元素的高度（不包括内边距，边框或外边距）。
       。。。。。。。。。。。。。。。。。。。。。
       jQuery innerWidth() 和 innerHeight() 方法：
       innerWidth() 方法返回元素的宽度（包括内边距，不包括外边距）。
       innerHeight() 方法返回元素的高度（包括内边距，不包括外边距）。
       。。。。。。。。。。。。。。。。。。。。。
       jQuery outerWidth() 和 outerHeight() 方法：
       outerWidth() 方法返回元素的宽度（包括内边距和边框）。
       outerHeight() 方法返回元素的高度（包括内边距和边框）。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery 遍历
       jQuery 遍历，意为"移动"，用于根据其相对于其他元素的关系来"查找"（或选取）HTML 元素。以某项选择开始，并沿着这个选择移动，直到抵达您期望的元素为止。
       遍历 DOM：jQuery 提供了多种遍历 DOM 的方法，遍历方法中最大的种类是树遍历（tree-traversal）。
       。。。。。。。。。。
       jQuery 遍历 - 祖先：
       祖先是父、祖父或曾祖父等等，通过 jQuery，您能够向上遍历 DOM 树，以查找元素的祖先。
       这些 jQuery 方法很有用，它们用于向上遍历 DOM 树：
       parent()方法，返回被选元素的直接父元素，该方法只会向上一级对 DOM 树进行遍历。
       parents()方法，返回被选元素的所有祖先元素，它一路向上直到文档的根元素 ()。
       parentsUntil()方法，返回介于两个给定元素之间的所有祖先元素。
       。。。。。。。。。。
       jQuery 遍历 - 后代：
       后代是子、孙、曾孙等等，通过 jQuery，您能够向下遍历 DOM 树，以查找元素的后代。
       下面是用于向下遍历 DOM 树的 jQuery 方法：
       children()方法，返回被选元素的所有直接子元素，该方法只会向下一级对 DOM 树进行遍历。
       find()方法，返回被选元素的后代元素，一路向下直到最后一个后代。
       。。。。。。。。。。。。。。
       jQuery 遍历 - 同胞(siblings)：
       同胞拥有相同的父元素，通过 jQuery，您能够在 DOM 树中遍历元素的同胞元素。
       在 DOM 树中水平遍历，有许多有用的方法让我们在 DOM 树进行水平遍历：
       siblings() 方法，返回被选元素的所有同胞元素。
       next()方法，返回被选元素的下一个同胞元素，该方法只返回一个元素。
       nextAll()方法，返回被选元素的所有跟随的同胞元素。
       nextUntil()方法，返回介于两个给定参数之间的所有跟随的同胞元素。
       prev()，prevAll()，prevUntil()方法，工作方式与上面的方法类似，只不过方向相反而已：它们返回的是前面的同胞元素（在 DOM 树中沿着同胞之前元素遍历，而不是之后元素遍历）。
       。。。。。。。。。。
       jQuery 遍历- 过滤：
       缩小搜索元素的范围：
       三个最基本的过滤方法是：first(), last() 和 eq()，它们允许您基于其在一组元素中的位置来选择一个特定的元素。
       其他过滤方法，比如 filter() 和 not() 允许您选取匹配或不匹配某项指定标准的元素。
       first()方法，返回被选元素的首个元素。
       last()方法，返回被选元素的最后一个元素。
       eq()方法，返回被选元素中带有指定索引号的元素，索引号从 0 开始，因此首个元素的索引号是 0 而不是 1。
       filter()方法，允许您规定一个标准。不匹配这个标准的元素会被从集合中删除，匹配的元素会被返回。
       not()方法，返回不匹配标准的所有元素，提示：not() 方法与 filter() 相反。
       :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - AJAX(创建交互式 Web 应用程序而无需牺牲浏览器兼容性的流行方法)
       AJAX 是与服务器交换数据的技术，它在不重载全部页面的情况下，实现了对部分网页的更新。
       AJAX = 异步 JavaScript 和 XML（Asynchronous JavaScript and XML）,简短地说，在不重载整个网页的情况下，AJAX 通过后台加载数据，并在网页上进行显示。
       jQuery 提供多个与 AJAX 有关的方法。
       通过 jQuery AJAX 方法，您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。
       。。。。。。。。。。。。。。
       jQuery - AJAX load() 方法：
       jQuery load() 方法是简单但强大的 AJAX 方法，load() 方法从服务器加载数据，并把返回的数据放入被选元素中。
       语法：$(selector).load(负荷)(URL(地址),data(数据),callback)。
       必需的 URL 参数规定您希望加载的 URL。
       可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。
       可选的 callback 参数是 load() 方法完成后所执行的函数名称。
       responseTxt - 包含调用成功时的结果内容
       statusTXT - 包含调用的状态
       xhr - 包含 XMLHttpRequest 对象
       。。。。。。。。。。。。。。。。。
       jQuery - AJAX get() 和 post() 方法：
       jQuery get() 和 post() 方法用于通过 HTTP GET 或 POST 请求从服务器请求数据。
       HTTP 请求：GET vs. POST：
       两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。
       GET - 从指定的资源请求数据
       POST - 向指定的资源提交要处理的数据
       GET 基本上用于从服务器获得（取回）数据。注释：GET 方法可能返回缓存数据。
       POST 也可用于从服务器获取数据。不过，POST 方法不会缓存数据，并且常用于连同请求一起发送数据。
       $.get() 方法通过 HTTP GET 请求从服务器上请求数据，语法：$.get(URL,callback)，必需的 URL 参数规定您希望请求的 URL，可选的 callback 参数是请求成功后所执行的函数名。
       $.post() 方法通过 HTTP POST 请求向服务器提交数据，语法：$.post(URL,data,callback)，必需的 URL 参数规定您希望请求的 URL。可选的 data 参数规定连同请求发送的数据。
       可选的 callback 参数是请求成功后所执行的函数名。
       ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       jQuery - noConflict(无抵触) 方法
       如何在页面上同时使用 jQuery 和其他框架？
       。。。。。。。。。。。。。。。
       jQuery 和其他 JavaScript 框架：
       正如您已经了解到的，jQuery 使用 $ 符号作为 jQuery 的简写。
       noConflict() 方法，会释放对 $ 标识符的控制，这样其他脚本就可以使用它了，您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用，您可以把它存入变量，以供稍后使用。
       如果你的 jQuery 代码块使用 $ 简写，并且您不愿意改变这个快捷方式，那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外，依旧不得不使用 "jQuery"。
       :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
       JSONP(跨域) 教程
       Jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。
       为什么我们从不同的域（网站）访问数据需要一个特殊的技术(JSONP )呢？这是因为同源策略。
       同源策略，它是由Netscape提出的一个著名的安全策略，现在所有支持JavaScript 的浏览器都会使用这个策略。

转载于:https://blog.51cto.com/13941970/2176458