Jquery预习1

预习

jquery概述

Jquery是对javaScript做了轻量级的封装,简化语法。
Jquery 理念: 写得少(语法简单), 做得多(功能强大)。

Jquery对象与DOM对象

Jquery对象就是通过Jquery()或$()包装DOM对象后产生的对象。Jquery 对象是 Jquery 独有的,如果一个对象是 Jquery 对象, 那么它就可以使用Jquery 里的方法: $(“#id”).html();
Jquery 对象无法使用DOM对象的任何方法, 同样DOM对象也不能使用Jquery里的任何方法。

Jquery对象转成DOM对象

Jquery对象不能使用DOM中的方法, 但如果不得不使用DOM对象的时候, 有如下两种处理方法:

1.Jquery对象是一个数组对象, 可以通过[index]的方法得到对应的DOM对象。

var $cr = $("#cr");
var cr = $cr[0];

2.使用Jquery中的get(index)方法得到相应的DOM对象。

var $cr = $("#cr");
var cr = $cr.get(0);

DOM对象转成Jquery对象

对于一个DOM对象, 只需要用 $() 把DOM对象包装起来(Jquery 对象就是通过Jquery包装DOM对象后产生的对象)， 就可以获得一个Jquery对象。转换后就可以使用Jquery中的方法了。

var cr = document.getElementById("cr");
var $cr = $(cr);

选择器

选择器是Jquery的根基，在Jquery中对事件处理，遍历DOM操作都依赖于选择器。

Jquery选择器的优点：简洁。

$("#id")	//document.getElementById("id");
$("Name")	//document.getElementByTagName("name");

基本选择器

基本选择器是Jquery中最常用的选择器，也是最简单的选择器,，它通过标签id、class和标签名来查找DOM标签(在网页中 id只能使用一次，class允许重复使用)。

(1)#id (2).class (3)element (4)selector1,selector2…复合选择器 (5)* 通配选择器

层次选择器

如果想通过DOM标签之间的层次关系来获取特定标签，例如后代标签、子标签、相邻标签、兄弟标签等，则需要使用层次选择器。
(1)selector1 selector2 后代
(2)selector1>selector2 只考虑子节点
(3)selector1+selector2 下一个兄弟
(4)selector1~selector2 表示下面所有的兄弟

过滤选择器

基本过滤

:first 第一个
:last 最后一个
:even 偶数
:odd 奇数
:eq(index) 指定的索引
:lt(index) 小于指定下标的
:gt(index) 大于指定下标的
:not(selector) 不包含指定的

属性过滤

[attribute]
[attribute=value]
[attribute!=value]

表单选择器

:input
:text
:password
:radio
:button
:submit
:reset
:image
:checkbox
:file
:hidden