xmid制作的JQuery图
什么是JQuery技术？
JQuery是一款跨浏览器的JavaScript库，封装了JavaScript相关的方法调用，简化了JavaScript对HTMl DOM操作。
为什么要使用JQuery库？
不同的浏览器对想同的JavaScript代码支持效果不同，而JQuery能兼容市面上的主流浏览器，除此之外，他还能兼容HTML/JSP/XML、CSS、DOM、事件、实现动画，也能提供异步AJAX请求等。
使用JavaScript定位DOM对象常用的三种方式：
1.通过ID属性：document.getElementById()
2.通过class属性：getElementByClassName()
3.通过标签名：document.getElementByTagName()
什么是DOM对象呢？
文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展
标志语言的标准编程接口。
通过 DOM 对 HTML 页面的解析，可以将页面元素解析为元素节点、属性节点和文本节
点，这些解析出的节点对象，即 DOM 对象。DOM 对象可以使用 JavaScript 中的方法。
JavaScript和JQuery对象
用 JavaScript 语法创建的对象叫做 JavaScript 对象, JavaScript 对象只能调用 JavaScript 对
象的 API。
用 JQuery 语法创建的对象叫做 JQuery 对象, jQuery 对象只能调用 jQuery 对象的 API。
jQuery 对象是一个数组。在数组中存放本次定位的 DOM 对象。
JQuery 对象与 JavaScript 对象是可以互相转化的，一般地，由于 Jquery 用起来更加方便，
我们都是将 JavaScript 对象转化成 Jquery 对象
DOM对象和JQuery对象
DOM 对象是用 JavaScript 语法创建的对象，也看做是 js 对象。
如何将一个DOM对象变成一个可操作的JQuery对象呢？
$(DOM对象名)
将一个JQuery对象转换为DOM对象
var obj = $("JQuery对象名").[0]
var obj = $("JQuery对象名").get(0)
JQuery对象本身为数组对象，该数组对象中的第0个元素即为该JQuery对象对应的DOM对象，因此有两种方式可以获得DOM对象：get(0)方式与下标方式[0]
JQuery选择器
选择器：就是定位条件，通知JQuery函数定位满足条件的DOM对象。
基本选择器
- id选择器 $("#id")
- class选择器 $(".class名称")
- 标签选择器 $(“标签名”) // 例如div
- 所有选择器 $("*")选择页面中的所有的DOM对象
- 组合选择器 $(“id选择器，class选择器，标签选择器”)
表单选择器
- text选择器：语法 $(":text") 选择所有的单行文本输入框
- radio选择器：语法 $(":radio") 这是一个数组获取属性值的话需要循环输出
- checkbox选择器：语法$(":checkbox")这也是一个数组需要循环输出
过滤器
基本过滤器
- 选择第一个 first, 保留数组中第一个 DOM 对象 语法：$(“选择器:first”)
- 选择最后个 last, 保留数组中最后最后 DOM 对象 语法：$(“选择器:last”)
- 选择数组中指定对象 语法：$(“选择器:eq(数组索引)”)
- 选择数组中小于指定索引的所有 DOM 对象 语法：$(“选择器:lt(数组索引)”)
- 选择数组中大于指定索引的所有 DOM 对象 语法 $(“选择器:gt(数组索引)”)
表单对象过滤器
- 选择可用的文本框：可改变输入框的内容等 语法：$(“:text:enabled”)
- 选择不可用的文本框：不能修改的文本框 语法：$(“:text:disabled”)
- 复选框选中的元素：选择框属性 语法：$(“:checkbox:checked”)
- 选择指定下拉列表的被选中元素：类似于省份城市选择 语法：选择器>option:selected
函数
第一组
1. val 操作数组中DOM对象的value属性
-
$(选择器).val() ：无参数调用形式， 读取数组中第一个 DOM 对象的 value 属性值,可以是name属性也可是id属性
-
$(选择器).val(值)：有参形式调用;对数组中所有 DOM 对象的 value 属性值进行统一赋值
2. text 操作数组中所有 DOM 对象的【文字显示内容属性】
- $(选择器).text():无参数调用，读取数组中所有 DOM 对象的文字显示内容，将得到内容拼接为一个字符串返回
- $(选择器).text(值):有参数方式，对数组中所有 DOM 对象的文字显示内容进行统一赋值
3.attr 对 val, text 之外的其他属性操作
- $(选择器).attr(“属性名”): 获取 DOM 数组第一个对象的属性值
- $(选择器).attr(“属性名”,“值”): 对数组中所有 DOM 对象的属性设为新值
第二组
-
1.hide $(选择器).hide() :将数组中所有 DOM 对象隐藏起来
-
2.show $(选择器).show():将数组中所有 DOM 对象在浏览器中显示起来
-
3.remove $(选择器).remove() : 将数组中所有 DOM 对象及其子对象一并删除
-
4.empty $(选择器).empty()：将数组中所有 DOM 对象的子对象删除
-
5.append 为数组中所有 DOM 对象添加子对象 $(选择器).append(“
我动态添加的 div”) -
6.html 设置或返回被选元素的内容（innerHTML） (选择器).html()：无参数调用方法，获取 DOM 数组第一个匹元素的内容。 $(选择器).html(值)：有参数调用，用于设置 DOM 数组中所有元素的内容
-
7.each 是对数组，json 和 dom 数组等的遍历,对每个元素调用一次函数。
-
语法 1：$.each( 要遍历的对象, function(index,element) { 处理程序 } ) -
语法 2：jQuery 对象.each( function(index, element ) { 处理程序 } ) index: 数组的下标 element: 数组的对象
JQuery处理AJAX函数
