jquery介紹 ：
jQuery是目前使用最廣泛的javascript函數(shù)庫，jquery是一個(gè)函數(shù)庫，一個(gè)js文件，頁面用script標(biāo)簽引入這個(gè)js文件就可以使用。
jquery加載 :
將獲取元素的語句寫到頁面頭部，會(huì)因?yàn)樵剡€沒有加載而出錯(cuò)，jquery提供了ready方法解決這個(gè)問題，它的速度比原生的 window.onload 更快。
1、http://jquery.com/官方網(wǎng)站
2、https://code.jquery.com/版本下載
完整寫法以及簡便寫法：
jquery選擇器 ：
jquery用法思想一：
選擇某個(gè)網(wǎng)頁元素，然后對它進(jìn)行某種操作
jquery選擇器：
jquery選擇器可以快速地選擇元素，選擇規(guī)則和css樣式相同，使用length屬性判斷是否選擇成功。
$(document) //選擇整個(gè)文檔對象
$('li') //選擇所有的li元素
$('#myId') //選擇id為myId的網(wǎng)頁元素
$('.myClass') // 選擇class為myClass的元素
$('input[name=first]') // 選擇name屬性等于first的input元素
$('#ul1 li span') //選擇id為為ul1元素下的所有l(wèi)i下的span元素
對選擇集進(jìn)行修飾過濾(類似CSS偽類)：
$('#ul1 li:first') //選擇id為ul1元素下的第一個(gè)li
$('#ul1 li:odd') //選擇id為ul1元素下的li的奇數(shù)行
$('#ul1 li:eq(2)') //選擇id為ul1元素下的第3個(gè)li
$('#ul1 li:gt(2)') // 選擇id為ul1元素下的前三個(gè)之后的li
$('#myForm :input') // 選擇表單中的input元素
$('div:visible') //選擇可見的div元素
對選擇集進(jìn)行函數(shù)過濾：
$('div').has('p'); // 選擇包含p元素的div元素
$('div').not('.myClass'); //選擇class不等于myClass的div元素
$('div').filter('.myClass'); //選擇class等于myClass的div元素
$('div').first(); //選擇第1個(gè)div元素
$('div').eq(5); //選擇第6個(gè)div元素
選擇集轉(zhuǎn)移：
$('div').prev('p'); //選擇div元素前面的第一個(gè)p元素
$('div').next('p'); //選擇div元素后面的第一個(gè)p元素
$('div').closest('form'); //選擇離div最近的那個(gè)form父元素
$('div').parent(); //選擇div的父元素
$('div').children(); //選擇div的所有子元素
$('div').siblings(); //選擇div的同級元素
$('div').find('.myClass'); //選擇div內(nèi)的class等于myClass的元素
jquery樣式操作 ：
? jquery用法思想二：
同一個(gè)函數(shù)完成取值和賦值
操作行間樣式：
// 獲取div的樣式
$("div").css("width");
$("div").css("color");
//設(shè)置div的樣式
$("div").css("width","30px");
$("div").css("height","30px");
$("div").css({fontSize:"30px",color:"red"});
特別注意：
選擇器獲取的多個(gè)元素，獲取信息獲取的是第一個(gè)，比如：$("div").css("width")，獲取的是第一個(gè)div的width。
操作樣式類名：
$("#div1").addClass("divClass2") //為id為div1的對象追加樣式divClass2
$("#div1").removeClass("divClass")? //移除id為div1的對象的class名為divClass的樣式
$("#div1").removeClass("divClass divClass2") //移除多個(gè)樣式
$("#div1").toggleClass("anotherClass") //重復(fù)切換anotherClass樣式
jquery屬性操作 ：
1、html() 取出或設(shè)置html內(nèi)容
?取出html內(nèi)容
var $htm = $('#div1').html();
?設(shè)置html內(nèi)容
$('#div1').html('添加文字');
2、text() 取出或設(shè)置text內(nèi)容
?取出文本內(nèi)容
var $htm = $('#div1').text();
設(shè)置文本內(nèi)容
$('#div1').text('添加文字');
3、attr() 取出或設(shè)置某個(gè)屬性的值
取出圖片的地址
var $src = $('#img1').attr('src');
?設(shè)置圖片的地址和alt屬性
$('#img1').attr({ src: "test.jpg", alt: "Test Image" });
綁定click事件：
給元素綁定click事件，可以用如下方法：
$('#btn1').click(function(){
? ? // 內(nèi)部的this指的是原生對象
? ? // 使用jquery對象用 $(this)
jquery特殊效果 ：
fadeIn() 淡入
? ? $btn.click(function(){
? ? ? ? $('#div1').fadeIn(1000,'swing',function(){
? ? ? ? ? ? alert('done!');
? ? ? ? });
? ? });
fadeOut() 淡出
fadeToggle() 切換淡入淡出
hide() 隱藏元素
show() 顯示元素
toggle() 依次展示或隱藏某個(gè)元素
slideDown() 向下展開
slideUp() 向上卷起
slideToggle() 依次展開或卷起某個(gè)元素
