jquery簡單學習
一、使用需求
要使用jquery要有jquery的文件，沒有得去下，自行百度。
二.導入文件
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>這裏是導入jquery，裏面的src為文件路徑，文件在哪就填哪。
三、程序入口寫法
<script typr="text/javascript">
$ ( function (){ ← ps:這句就是入口
所有代碼都寫在這裏
});
</script>
四、工廠函數
$() 這就是一個工廠函數，返回的是一個jquery對像，括號裏面叫表達式
五、選擇器
如果你要精確某個標簽或某個id某個class就要用到選擇器
標簽名選擇器：用HTML標簽名作選擇器 ，
寫法： $("標簽名") ，如div標簽：$("div")
註意：這裏會獲取所有相同的標簽，改變會全部改變
id選擇器：用id作選擇器
寫法： $("#id名") ， 如id名為a：$("#a")
註意：這裏如果有相同名字的id，會獲取第一個id，之後的後不會獲取
class選擇器：用class作選擇器
寫法： $(".class名")， 如class名為b：$(".b")
註意：這裏會獲取所有相同的class名，改變會全部改變
多個選擇器：只要寫上選擇器名字然後用逗號隔開 ,
寫法：如上面的所有選擇器： $("div,#a,.c")
註意：這裏只寫三個，還可以更多
後代選擇器：用一個元素的所有後代元素作選擇器
寫法：$("a b")， a是一個元素，b是其後代元素，中間用空格隔開 ，如form下的input：$("form input")
註意：只要在a元素的標簽裏面，不管b元素的層次是多少都會獲取
說白了不管是兒子還是孫子還是孫孫孫子，只要相同名字都會獲取到
子選擇器：一個元素的子元素作選擇器
寫法：$("a>b")， a是父元素，b是其子元素，中間用>隔開 ，如form下的input：$("form>input")
註意：這只會獲取父元素下的相同名字的子元素，其他名字的子元素獲取不到
說白了就是只能獲取相同名字兒子，獲取不到名字不同的其他兒子或孫子
緊鄰同輩選擇器：這個我自己好難說明，說白了就是同一個爸爸，有兒子，老大下面肯定是老二，用老二作選擇器
相鄰同輩選擇器：這個也有點難說，說白了就是同一個爸爸，有兒子，只要和老大同輩分且在它後面就會獲取
六、常見事件
寫法：$(function(){
$("#a").事件名(function(){
發生事件要做什麽(寫代碼)
});
});
如點擊彈出消息框
常見事件
click：鼠標點擊事件
ready：網頁加載完成事件
dblclick：鼠標雙擊事件
focus：獲得焦點事件
blur：失去焦點事件
mouseover：鼠標懸停在上面事件
mouseout：鼠標離開事件
keydown：鍵盤按事件
keypress：鍵盤按下並松開事件
keyup：鍵盤松開事件
change：文本內容改變事件
還有一些事件，自行百度
七、常見jquery方法
寫法：$(function(){
$("#a").事件名(function(){
$("#a").方法名();
});
});
如獲取文本內容並彈出顯示
常見方法
text()：獲取文本內容
如id為a的文本內容：$("#a").text();
還可以設置文本內容，設置為aa：$("#a").text("aa");
val()：獲取值value
如id為a的值：$("#a").val();
還可以設置值，設置為aa：$("#a").val("aa");
thml()：獲取整個標簽
如id為a的裏面的標簽：$("#a").html();
還可以設置id為a的a標簽內容，原本為 <div id="a"><a href="#">test</a></div>
設置為：$("#a").html("<a href=‘http://www.163.com‘>網易</a>");
css()：獲取css屬性
如id為a的css背景顏色：$("#a").css("backgroundColor");
還可以設置為紅色：$("#a").css("backgroundColor","#f00");
css的設置都為 css("屬性名","值")；
八、包裝集
什麽是包裝集？ 就是一個變量裏面存放了多個對象的變量就是包裝集；
用法：對象名.方法名()
length：用來返回一個變量的長度值 註意這是沒有括號的
如一個字符串"aaaa"，"aaaa".length 就會返回4的整數
如變量aa存放3個對象，aa.length 就會返回一個3的整數
index()：返回對象的包裝集下標，獲取的對象集也都是DOM對對象，它們沒有jquery的方法,註意轉換
寫法：包裝集.index(包裝集的一個對象)，註意index(int)並不會返回對應的對象
如包裝集為aa，裏面的對象a，aa.index(a)，會返回這個a對象所在的下標
DOM對象轉化為jquery對象，只需要加上$()這個
如 $(aa[1]) 這樣會把第二個元素轉化為jquery對象，就能用jquery方法了
get()：獲取包裝集裏面的對象，用get()或[ ]獲取的都是DOM對象
寫法：包裝集.get(下標)，如：aa.get(2)，會獲取第二個DOM對象
[ ]寫法：包裝集[下標]，如：aa[2]，會獲取第二個DOM對象
add()：添加，添加一個標簽
寫法：對象或包裝集.add("標簽").appendTo(添加到哪裏)
如b對象添加標簽a到body裏面： b.add("<a href=‘#‘>123</>").appendTo(document.body);
clone()：克隆，克隆一個標簽
寫法：對象或標簽名.clone().appdendTo(克隆到哪裏)
如標簽a克隆到body裏面： $("a").clone().appendTo(document.body);
not()：剔除，把not("選擇器")裏面的選擇器剔除掉
寫法：包裝集.not("一個,倆個,三個,……").其他方法()
如4個div，id分別為a，b，c，d,改變其背寬度不要b，c
$("div").not("#b,#c").css("widtg","200px");
filert()：僅保留 ，把filert("選擇器")保留，其它剔除掉
寫法：包裝集.filert("一個,倆個,三個,……").其他方法()
如4個div，id分別為a，b，c，d,改變其背寬度不要a，d
$("div").filert("#b,#c").css("widtg","200px");
slice()：把slice(開始下標，結束下標)在範圍裏的選擇器保留，其它剔除
寫法：包裝集.slice(開始下標，結束下標).其他方法()， 等於開始下標，不等於結束下標
如長度為4的aa包裝集保留中間兩個並改變其高度，
如：aa.silce(1,3).css("height","50px");
each()：遍歷，把包裝集瀏覽一個一個的遍歷出來，
寫法：包裝集.each(funtction(){
一個一個遍歷出來要做什麽
})；
如長度為4的aa包裝集遍歷了都彈出消息
aa.each(function(){
alert("11");
});
九、ajax
什是是ajax？ 是一種在無需重新加載整個網頁的情況下，能夠更新部分網頁的技術；
寫法
$(function(){
$("選擇器").事件(function(){
$.ajax({
一些操作...;
})
});
});
ajax常用的七個參數
url：訪問地址,
type：訪問的方法，訪問的方法主要有兩種‘GET‘或‘POST‘；
data：傳遞過去的數據, 傳遞過去的數據主要有三種，分別是url拼接式，json數組，表單的序列化，
url拼接：在url哪裏加?加數據，如 url:‘A?name=張三‘，這是常量； 變量的 url:‘A?‘+變量, 不推薦
json：在data:打上花括號，如 data:{name:"張三"} ，這是常量； 變量的 data:{name:變量名}，推薦
序列化： 序列化就是提交的時候把name和值自動轉化為 name=值（值是中文就會像亂碼）的形式發送過去
var 變量名 = $("表單選擇器或者表單的id").serialize()
data:變量名, 就行了
dataType：返回的數據類型,
success：訪問成功執行的函數,
error：訪問失敗執行的函數,
timeout：訪問的時間
ajax的例子
jquery簡單學習