一個(gè)jQuery對(duì)象實(shí)際上是包含了一些DOM對(duì)象舱痘，外加jQuery自己提供了一些方法的集合主之。
jQuer對(duì)象轉(zhuǎn)換成DOM對(duì)象 ? $(window)[0]??
querySelector方法返回在DOM樹(shù)中查找到的匹配參數(shù)條件的第一個(gè)元素
http簡(jiǎn)單介紹
??HTTP協(xié)議是Hyper Text Transfer Protocol（超文本傳輸協(xié)議）的縮寫,是用于從萬(wàn)維網(wǎng)服務(wù)器傳輸超文本到本地瀏覽器的傳送協(xié)議。HTTP是一個(gè)基于TCP/IP通信協(xié)議來(lái)傳遞數(shù)據(jù)（HTML 文件, 圖片文件, 查詢結(jié)果等）
??? HTTP工作原理
HTTP協(xié)議工作于客戶端-服務(wù)端架構(gòu)為上。瀏覽器作為HTTP客戶端通過(guò)URL向HTTP服務(wù)端即WEB服務(wù)器發(fā)送所有請(qǐng)求。
Web服務(wù)器有：Apache服務(wù)器，IIS服務(wù)器（Internet Information Services）等辛馆。
Web服務(wù)器根據(jù)接收到的請(qǐng)求后，向客戶端發(fā)送響應(yīng)信息。
HTTP默認(rèn)端口號(hào)為80昙篙，但是你也可以改為8080或者其他端口
??? HTTP三點(diǎn)注意事項(xiàng)：
1.HTTP是無(wú)連接：無(wú)連接的含義是限制每次連接只處理一個(gè)請(qǐng)求腊状。
2.HTTP是媒體獨(dú)立的：這意味著，只要客戶端和服務(wù)器知道如何處理的數(shù)據(jù)內(nèi)容苔可，任何類型的數(shù)據(jù)都可以通過(guò)HTTP發(fā)送缴挖。
3.?HTTP是無(wú)狀態(tài)：HTTP協(xié)議是無(wú)狀態(tài)協(xié)議。無(wú)狀態(tài)是指協(xié)議對(duì)于事務(wù)處理沒(méi)有記憶能力焚辅。
一個(gè)完整的http事務(wù)
1）域名解析 -->
2) 發(fā)起TCP的3次握手 -->
3) 建立TCP連接后發(fā)起http請(qǐng)求 -->
4) 服務(wù)器響應(yīng)http請(qǐng)求映屋，瀏覽器得到html代碼 -->
5）瀏覽器解析html代碼，并請(qǐng)求html代碼中的資源（如js同蜻、css棚点、圖片等） -->
6）瀏覽器對(duì)頁(yè)面進(jìn)行渲染呈現(xiàn)給用戶 -->
HTTP請(qǐng)求格式主要有四部分組成，分別是：請(qǐng)求行湾蔓、請(qǐng)求頭瘫析、空行、消息體默责，每部分內(nèi)容占一行贬循。
服務(wù)器接收處理完請(qǐng)求后返回一個(gè)HTTP相應(yīng)消息給客戶端。HTTP響應(yīng)消息的格式包括：狀態(tài)行桃序、響應(yīng)頭杖虾、空行、消息體媒熊。
<p id="info">Hello</p>
document.getElementById("info").innerHTML="pig"
$("#info").html('余建')
方便DOM的選取和操作奇适，響應(yīng)用戶操作，簡(jiǎn)化Ajax操作
typeof ? ?$("#info") ? ? ? ? "object"
$("#info") ? ?轉(zhuǎn)化為 ? ? $("#info")[0] ? ?等于?$("#info")get(0)
var p=document.getElementById("info") ? ? 轉(zhuǎn)化為 ? ? ? $(p)
$ === jQuery ? 結(jié)果為 ? ?true
獲取選擇器
<div class="info">0</div> ? ? ? ? ? ? ? ? $('.info:first').text() ? ? ? ?0
<div class="info">1</div> ? ? ? ? ? ? ? ? ? ? ?$('.info:gt(1)').text() ? ? ? ? ? ? ? ?"234"?
<div class="info">2</div> ? ? ? ? ? ? ? ? ? ??$('.info:lt(3)').text() ? ? ? ? ? ? ? ? ?"012"
<div class="info">3</div> ? ? ? ? ? ? ? ? ?$('.info:eq(3)').text() ? ? ?3
<div class="info">4</div> ? ? ? ? ? ? ? ? ?$('.info:last').text() ? ? ? ?4
屬性選擇器
<a>0</a> ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? $('a[href]') ? ? ? 1 2 3
<a href="/info">1</a> ? ? ? ? ? ? ? ? ? ? ? ? ??$('a[href="/info"]') ? ? ? ? ? ? ? ?1
<a href="/infomation">2</a> ? ? ? ? ? ? ??$('a[href$="tion"]') ?（結(jié)尾） ? ? ? ? ? ? 2
<a href="/test">3</a> ? ? ? ? ? ? ? ? ? ? ? ? ??$('a[href*="info"]').text() ? ?（包含） ? 1 ?2
<form>
? ? <label>Name:</label>
? ? <input name="name">
? ? <fieldset>
? ? ? ? <label>Newsltter:</label>
? ? ? ? <input name="firstletter">
? ? ? ? <input name="secondletter">
? ? </fieldset>
? ? <input name="none">
</form>
層級(jí)選擇器
$('form>input')
$('form input')
$('label+input') ? 相鄰
$('label~input') ? 所有
<div>
? ? <p><span>Hello</span></p>
</div>
<div>Hello again</div>
篩選
$('div:has(span)')?
<p id="info">Hello</p>
<style>
? ? .big{
? ? ? ? background-color:green;
font-size:30px;
}
</style>
$("#info").attr('class','big') ? ?
等價(jià) ? ?var p=document.getElementById("info")
? ? ? ? ? ? ? ? ? p.getAttribute('class') ? ??"big"
? ? ? ? ? ? ? ? ? p.setAttribute('class','') ??
<div>
? ? <div id="div">我是DIV元素</div>
? ? <p id="p">我是P元素</p>
</div>
$('#div').insertAfter($('#p')) ? ? 返回 ?div 元素（p芦鳍、div）
$('#div').after($('#p')) ? ? ??? ? ? ?返回 ?p 元素 （div嚷往、p）
元素的操作
$("ul").append("<li>list item</li>")
jQuery事件
$('#info').click(function(){console.log("hello")})
<script>
? ? $('#info').click(function(){
? ? ? ? console.log(this.innerHTML);
})
</script>
Hello
<script>
? ? $('#info').click(function(){
? ? ? ? console.log($(this));
})
</script>
fn.init?[p#info]
0: p#info
length: 1
__proto__: Object(0)
事件綁定
$('#info').bind('click mouseenter',function () { console.log(this);}) ? ? 多個(gè)事件用空格隔開(kāi)
解綁
$('#info').unbind('mouseenter')
事件操作 ?trim（去除字符串首末兩端空格）
var arr=[1,2,3,4,1,2];
$.each(arr,function(index,item){
console.log(index+':'+);
})
0:1 ?1:2 ?2:3 ?3:4 ? 4:1 ? 5:2
Ajax跨域問(wèn)題
使用如下標(biāo)頭可以接受全部網(wǎng)站請(qǐng)求：header('Access-Control-Allow-Origin:*') ?；
什么是跨域怜校？
跨域间影，指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本注竿。它是由瀏覽器的同源策略造成的茄茁，是瀏覽器施加的安全限制。
所謂同源是指巩割，域名裙顽，協(xié)議，端口均相同宣谈，不明白沒(méi)關(guān)系愈犹，舉個(gè)栗子：
http://www.123.com/index.html 調(diào)用 http://www.123.com/server.php （非跨域）
http://www.123.com/index.html 調(diào)用 http://www.456.com/server.php （主域名不同:123/456，跨域）
http://abc.123.com/index.html 調(diào)用 http://def.123.com/server.php （子域名不同:abc/def，跨域）
http://www.123.com:8080/index.html 調(diào)用 http://www.123.com:8081/server.php （端口不同:8080/8081漩怎，跨域）
http://www.123.com/index.html 調(diào)用 https://www.123.com/server.php （協(xié)議不同:http/https，跨域）
請(qǐng)注意：localhost和127.0.0.1雖然都指向本機(jī)，但也屬于跨域旱物。
瀏覽器執(zhí)行javascript腳本時(shí)羊壹，會(huì)檢查這個(gè)腳本屬于哪個(gè)頁(yè)面，如果不是同源頁(yè)面叁执，就不會(huì)被執(zhí)行茄厘。
解決辦法：
1、JSONP：
使用方式就不贅述了谈宛，但是要注意JSONP只支持GET請(qǐng)求次哈，不支持POST請(qǐng)求。
2吆录、代理：
例如www.123.com/index.html需要調(diào)用www.456.com/server.php窑滞，可以寫一個(gè)接口www.123.com/server.php，由這個(gè)接口在后端去調(diào)用www.456.com/server.php并拿到返回值径筏，然后再返回給index.html葛假，這就是一個(gè)代理的模式。相當(dāng)于繞過(guò)了瀏覽器端滋恬，自然就不存在跨域問(wèn)題聊训。
3、PHP端修改header（XHR2方式）
在php接口腳本中加入以下兩句即可：
header('Access-Control-Allow-Origin:*');//允許所有來(lái)源訪問(wèn)
header('Access-Control-Allow-Method:POST,GET');//允許訪問(wèn)的方式
