Jquery 学习笔记一

美元符号加上括号

$()

是jquery函数的简写名，利用这个快捷方式，就不需要在调用jquery函数时写上

jQuery()

，jQuery函数通常还被称为jQuery包装器。

jQuery()

：这个就是jQuery函数，他的主要工作是获取括号中指定的元素，他有一个快捷方式

$()

括号中可以放入三种不同的内容：CSS选择器，HTML，Javascript Object.

jQuery选择元素的方式

CSS中的元素选择器:

h1{text-align:left;}

会将HTML文档中的所有

h1

元素选出来，

.my_class{position:absolute;}

会将所有类名为

my_class

的元素选出来，而

#my_id{color:#3300F}

则是选出id号为

my_id

的元素。

而在jQuery中选择的方式也是类似的，如

$('h1').hide()

则是将页面中的

h1

元素选出来，

hide()

方法将其进行隐藏。

即

$('xxx').方法()

的使用方式。

$()

的参数可以是HTML元素的标签名，HTML元素标签的属性值，css选择器和js对象。如：

$('p')

选出HTML页面中的

<p>

元素，

$(".myClass")

选出页面中

class=myClass

的元素，

$("#myId")

选出页面中

id=myId

的元素。也可以组合使用，如：

$("p#myid")

选出页面中

id=myid

的

<p>

元素。

$('span.Italian') .toggle()

选出页面中

class=Italian

的

<span>

元素，并对其调用

toggle()

方法。

CSS选择器为选出来的元素增加样式，而jQuery为选出来的元素增加行为。

$("button").click(function(){})

:告诉jQuery选出

button

元素，当button被单击时，执行

function(){}

中的代码。

处理滑动有3种方法，

slideUp()

：改变元素的

height

属性，直到高度为0，然后将元素隐藏

slideDown()

：将元素的

height

属性从0改为CSS样式表中设置的值，

slideToggle()

：如果原来朝上，就向下滑动，如果原来朝下，就向上滑动。

元素淡入时，会从不可见（透明）逐渐变为可见（不透明），实现淡入的方法有

fadeIn()

,

fadeOut

,

fadeTo

,

fadeToggle

，如：想要

<img>

元素淡入，可以使用

$("img").fadeIn()

，可以在括号中放入一个值来指定以多快的速度淡入，一般单位为毫秒。

追加内容使用

append()

方法，如：

$("p").append('xxx')

告诉js解释器要将括号中的内容追加到所有的段落元素中。

this

表示当前正在处理的元素，即

$(this)

所选出来的东西依赖于上下文环境如：

$("#myImg").click(function(){ $(this).slideUp(); });

中的

this

指的就是

$("#myImg")

。

使用

remove()

方法可以将一个元素或者一组元素从页面上删除，如：

$("li").remove()

会将页面中的所有

<li>

元素删除。

后代选择器可以选择出元素的子元素，父元素在左边，子元素在右边，父元素和子元素之间用一个空格隔开，如：

$("div p")

选择出

<div>

中的

<p>

元素，还可以选出孩子的孩子，如：

$("div div p")

，

$(div p#my_id)