JQuery入门基础

概述

jQuery是javascript类库，简称JS库。它预定义了一套对象和函数，简化了javascript的开发，帮开发者建立高难度交互的web2.0特性的富客户端页面。

jQuery的四个模块
1.jQuery - 应用于PC端Web
2.jQuery UI - 应用于Web页面效果
3.jQuery Mobile - 应用于移动端Web
4.Qunit - 应用于javascript代码的测试

jQuery特点
1.jQuery支持链式操作
示例：$(“#username”).val()
2.jQuery对象是类数组对象，获取元素2种方式
- jQuery[index]
- get(index)

使用jQuery的步骤
1.在HTML页面中引入jQuery文件
2.通过jQuery提供的选择器获取元素
3.使用jQuery提供的API内容完成功能

DOM对象与jQuery对象的转换

1.DOM对象转换为jQuery对象
语法： $(DOM对象)

示例：	
var username = document.getElementById("username");// DOM对象
var $username = $(username);// 转换为jQuery对象
console.log($username.val());//使用jQuery方法

2.jQuery对象转换为DOM对象
语法： 获取第0个下标

示例：	
var $uName = $("#uName");//jQuery对象
var uName1= $uName[0];//转换为DOM对象
console.log(uName1.value);//使用DOM方法

如何解决jQuery与其他JS库共存问题($符号)

1、先引入多个JS库，先调用的优先级高（如果发生符号冲突）
解决办法：4个

1. 不再使用"$“,而使用"jQuery”

2. 调用jQuery.noConflict()方法,将"$“符号的使用权交出(供其他JS库使用)
   当调用该方法之后,如果再使用jQuery的话,只能使用"jQuery”

3. 先调用jQuery.noConflict()方法，交出使用权，在jQuery()中使用$

jQuery(
function($){// 函数域
					// function中定义形参"$"
					$("ul>li");
					}
);

4. 调用jQuery.noConflict()方法，使用自调函数，传递jQuerys,将参数设为$

(function($){// 函数域
	$("ul>li");
})(jQuery);

常用API

选择器（9大类）

jQuery的选择器是沿用并且扩展CSS选择器

1、基本选择器

1. #id ：根据给定的ID匹配一个元素。

例：$("#myDiv");

2. element ：根据给定的元素名匹配所有元素。

例：$("div");

3. .class ：根据给定的类匹配元素。

例：$(".myClass");

4. * ：匹配所有元素。

例$("*")

5. selector1,selector2,selectorN ：将每一个选择器匹配到的元素合并后一起返回。

例：$("div,span,p.myClass")

2、层级选择器

1. ancestor des