jsonp

ajax只能請(qǐng)求同一個(gè)域下的數(shù)據(jù)或資源，有時(shí)候需要跨域請(qǐng)求數(shù)據(jù)，就需要用到j(luò)sonp技術(shù)句柠，jsonp可以跨域請(qǐng)求數(shù)據(jù)，它的原理主要是利用了script標(biāo)簽可以跨域鏈接資源的特性棒假。

jsonp的原理如下：

<script type="text/javascript">
function aa(dat){
alert(dat.name);
}
</script>
<script type="text/javascript" src="....../js/data.js"></script>

頁(yè)面上定義一個(gè)函數(shù)溯职，引用一個(gè)外部js文件，外部js文件的地址可以是不同域的地址帽哑，外部js文件的內(nèi)容如下：

aa({"name":"tom","age":18});

外部js文件調(diào)用頁(yè)面上定義的函數(shù)谜酒，通過(guò)參數(shù)把數(shù)據(jù)傳進(jìn)去。

正則表達(dá)式

1祝拯、什么是正則表達(dá)式：
能讓計(jì)算機(jī)讀懂的字符串匹配規(guī)則甚带。

2、正則表達(dá)式的寫(xiě)法：
var re=new RegExp('規(guī)則', '可選參數(shù)');
var re=/規(guī)則/參數(shù);

3佳头、規(guī)則中的字符
1）普通字符匹配：
如：/a/ 匹配字符 ‘a(chǎn)’，/a,b/ 匹配字符 ‘a(chǎn),b’

2）轉(zhuǎn)義字符匹配：
\d 匹配一個(gè)數(shù)字晴氨，即0-9
\D 匹配一個(gè)非數(shù)字康嘉，即除了0-9
\w 匹配一個(gè)單詞字符（字母、數(shù)字籽前、下劃線）
\W 匹配任何非單詞字符亭珍。等價(jià)于[^A-Za-z0-9_]
\s 匹配一個(gè)空白符
\S 匹配一個(gè)非空白符
\b 匹配單詞邊界
\B 匹配非單詞邊界
. 匹配一個(gè)任意字符，除了換行符‘\n’和回車符‘\r’
\1 重復(fù)子項(xiàng)

4枝哄、量詞：對(duì)左邊的匹配字符定義個(gè)數(shù)
? 出現(xiàn)零次或一次（最多出現(xiàn)一次）

• 出現(xiàn)一次或多次（至少出現(xiàn)一次）

• 出現(xiàn)零次或多次（任意次）
  {n} 出現(xiàn)n次
  {n,m} 出現(xiàn)n到m次
  {n,} 至少出現(xiàn)n次

5肄梨、任意一個(gè)或者范圍
[abc123] : 匹配‘a(chǎn)bc123’中的任意一個(gè)字符
[a-z0-9] : 匹配a到z或者0到9中的任意一個(gè)字符

6、限制開(kāi)頭結(jié)尾
^ 以緊挨的元素開(kāi)頭
$ 以緊挨的元素結(jié)尾

7挠锥、修飾參數(shù)：
g： global众羡，全文搜索，默認(rèn)搜索到第一個(gè)結(jié)果接停止
i： ingore case蓖租，忽略大小寫(xiě)粱侣，默認(rèn)大小寫(xiě)敏感
m： multiple lines，多行搜索（更改^ 和$的含義蓖宦，使它們分別在任意一行對(duì)待行首和行尾匹配齐婴，而不僅僅在整個(gè)字符串的開(kāi)頭和結(jié)尾匹配）

8、常用函數(shù)
1稠茂、test
用法：正則.test(字符串) 匹配成功柠偶，就返回真，否則就返回假

2、search
用法：字符串.search(正則) 匹配成功诱担，返回位置毡证，否則返回-1

3、match
用法： 字符串.match(正則)该肴；匹配成功情竹，就返回匹配成功的數(shù)組，否則就返回null

4匀哄、replace
用法：字符串.replace(正則秦效，新的字符串) 匹配成功的字符去替換新的字符

正則默認(rèn)規(guī)則
匹配成功就結(jié)束，不會(huì)繼續(xù)匹配涎嚼，區(qū)分大小寫(xiě)

本地存儲(chǔ)

本地存儲(chǔ)分為cookie阱州，以及新增的localStorage和sessionStorage

1、cookie 存儲(chǔ)在本地法梯，容量最大4k苔货，在同源的http請(qǐng)求時(shí)攜帶傳遞，損耗帶寬立哑，可設(shè)置訪問(wèn)路徑夜惭，只有此路徑及此路徑的子路徑才能訪問(wèn)此cookie，在設(shè)置的過(guò)期時(shí)間之前有效铛绰。

jquery 設(shè)置cookie
[圖片上傳失敗...(image-d2495b-1547379898691)]

.cookie('mycookie');

2诈茧、localStorage 存儲(chǔ)在本地，容量為5M或者更大捂掰，不會(huì)在請(qǐng)求時(shí)候攜帶傳遞敢会，在所有同源窗口中共享，數(shù)據(jù)一直有效这嚣，除非人為刪除鸥昏，可作為長(zhǎng)期數(shù)據(jù)。

//設(shè)置：
localStorage.setItem("dat", "456");
localStorage.dat = '456';

//獲冉阒恪：
localStorage.getItem("dat");
localStorage.dat

//刪除
localStorage.removeItem("dat");

3吏垮、sessionStorage 存儲(chǔ)在本地，容量為5M或者更大卧土，不會(huì)在請(qǐng)求時(shí)候攜帶傳遞惫皱，在同源的當(dāng)前窗口關(guān)閉前有效。

localStorage 和 sessionStorage 合稱為Web Storage , Web Storage支持事件通知機(jī)制尤莺，可以將數(shù)據(jù)更新的通知監(jiān)聽(tīng)者旅敷，Web Storage的api接口使用更方便。

iPhone的無(wú)痕瀏覽不支持Web Storage颤霎，只能用cookie媳谁。

jqueryUI

jQuery UI是以 jQuery 為基礎(chǔ)的代碼庫(kù)涂滴。包含底層用戶交互、動(dòng)畫(huà)晴音、特效和可更換主題的可視控件柔纵。我們可以直接用它來(lái)構(gòu)建具有很好交互性的web應(yīng)用程序。

jqueryUI 網(wǎng)址
http://jqueryui.com/

常用jqueryUI插件：

Draggable
1锤躁、設(shè)置數(shù)值的滑動(dòng)條
2搁料、自定義滾動(dòng)條