jQuery对象与DOM对象的转换

jQuery

jQuery是javascript框架，就是一个普通的js文件，封装了许多的函数；
jQuery中的顶级对象是：jQuery （$）;
jQuery中的页面加载事件有三种：

$(window).load(function(){}) //当页面全部加载完毕后执行

$(document.ready(function(){})//执行先于load

$(function(){}) //推荐

在jQuery中，只有jQuery对象才可以使用jQuery的语句，而BOM对象使用将会报错。因此我们需要将BOM对象转换成jQuery对象。

//将DOM对象转换成jQuery对象：
$(对象)   //采用$ + 对象名的方式
//DOM中的this也需要转换：
$(this);
//将jQuery对象转换成DOM对象：
$(jQuery对象).get(0);//或
$(jQuery对象)[0];

jQuery 选择器

jQuery 元素选择器：
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。

jQuery 属性选择器
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

jQuery CSS 选择器
jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

jQuery动画

//jQuery hide() 和 show()：显示隐藏
$("#div1").click(function(){
  $("p").hide();
});

$("#div2").click(function(){
  $("p").show();
});

//jQuery Fadout  fadeIn() : 淡入淡出
$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

//jQuery slideDown()slideUp() 滑入滑出
$("#flip").click(function(){
  $("#panel").slideDown();
});

//自定义动画：animate（） 注意：此方式无法改变背景色
参数1：必写，要动画的对象属性
参数2：执行时间（默认normal  可省）
参数3： 动作方式：swing：缓动  linear ：匀速
参数4： function  动画执行完毕后要执行函数，（可省）

stop：停止动画效果。参数均为布尔值。
参数一：是否清楚动画队列
参数二：是否让动画跳转到最终效果