? ? ? ? ? ? 《復(fù)習(xí)筆記》
一慨丐、ajax
ajax：無(wú)刷新從服務(wù)器取數(shù)據(jù)；
緩存：瀏覽器針對(duì)同一個(gè)網(wǎng)址只會(huì)訪問(wèn)一次
ajax防止緩存方法：
添加隨機(jī)數(shù)【隨機(jī)因子】
ajax注意：文件編碼格式要保持一直
從后臺(tái)取數(shù)據(jù)傳過(guò)來(lái)的都是字符串
ajax：不允許跨域取數(shù)據(jù)
創(chuàng)建post請(qǐng)求：
oAjax.open('post',url,true);
oAjax.setRequestHeader('Content-type','Application/x-www-form-urlencoded');
oAjax.send(json2url(json.data));
創(chuàng)建get請(qǐng)求：
oAjax.open('get',urk,true);
oAjax.send();
轉(zhuǎn)換data格式：
function json2url(json){
? ?var arr = [];
? ?for(var name in json){
arr.push(name + '=' + json[name])
}
return arr.join('&');
}
eval：就是把字符串解析成js可移執(zhí)行的任何代碼
jsonp：跨域取數(shù)據(jù)
實(shí)現(xiàn)原理：動(dòng)態(tài)添加script標(biāo)簽
script：是一次性標(biāo)簽备闲；改變src屬性需要重新加載執(zhí)行
onkeydown：鍵盤(pán)按下事件
onkeyup：鍵盤(pán)抬起事件
event:存儲(chǔ)或描述事件更加詳細(xì)的信息
?event.clientX;
event.clientY;
event.keyCode;
event.cancelBubble = true;//兼容低版本IE 阻止事件冒泡
event.stopprapagation ? //標(biāo)準(zhǔn)瀏覽器 阻止事件冒泡
事件冒泡:
?子元素的事件可以傳遞給父元素恬砂，如果父元素有相同的事件伶唯，會(huì)觸發(fā)，否則會(huì)繼續(xù)往上冒泡
事件捕獲：Obj.setCapture();//IE獨(dú)有的
把多有的精力都放到某一個(gè)事件上,點(diǎn)擊頁(yè)面任何地方都相當(dāng)域在點(diǎn) ? 擊這個(gè)按鈕;
? 釋放捕獲：obj.releaseCapture();//IE獨(dú)有的;
事件綁定[監(jiān)聽(tīng)]:
obj.addEventListener(事件名,函數(shù)名,false);事件名不加on;
? obj.attachEvent(事件名,函數(shù)名);事件名必須加on;
同一個(gè)元素,同一個(gè)事件,需要執(zhí)行不同的方法;
? ? 刪除事件綁定：
obj.removeEventListener(事件名瞪讼，函數(shù)名粹断，false)；//事件名不加on;
obj.detachEvent(on+"事件名"希柿，函數(shù)名);
事件委托:
?把子元素的事件委托給父元素來(lái)執(zhí)行;
?oTarget = oEvent.srcElement || oEvent.target;
?if(oTarget.targName == 'UL'){
//code
? ?}
阻止事件：
? ?組織事件的兼容寫(xiě)法：
1、if（event.preventDfault）{
? ?event.preventDefault();//標(biāo)準(zhǔn)瀏覽器
}else{
? ?event.returnValue=false;//IE瀏覽器
}
2端姚、return false 常用的組織事件方式挤悉，但后面的代碼不會(huì)再觸發(fā)
事件移除：removeEventListener(event,function);
事件源：
? IE：?window.event.srcElement
標(biāo)準(zhǔn)：event.target;
-----------------------------------------------------------------------------------
鍵碼：
? ctrl：ctrlKey
? shift：shiftKey
? alt：altKey
-----------------------------------------------------------------------------------
jsonp:
?跨域取數(shù)據(jù);
script是一次性的;src屬性需要加載執(zhí)行;
事件冒泡:
?子元素的事件可以傳遞給父元素,父元素有相同事件會(huì)執(zhí)行,否則會(huì)一直網(wǎng)上冒泡;
?取消事件冒泡:
?oEvent.cancelBubble = true;
事件捕獲:
?obj.setCapture();IE獨(dú)有的;
事件釋放捕獲：
?obj.releaseCapture();IE獨(dú)有的;
事件綁定:
?obj.addEventListener(sEv,fn,false);-->事件名不加on;
?obj.attachEvent('on'+sEv,fn); --->事件名必須加on;
事件解除綁定:
?obj.removeEventListener(sEv,fn,false);--->事件名不加on;
?obj.detachEvent('on'+sEv,fn); --->事件名必須加on;
事件委托:
?把子元素的事件委托給父元素來(lái)執(zhí)行;
?oTarget = oEvent.srcElement || oEvent.target;
?if(oTarget.tagName == 'UL'){
? ?//code;
?}
------------------------------------------------------------------------------------
鍵碼:
?ctrl:ctrlKey
?shift:shiftKey
?alt:altKey
----------------------------------------------
AngularJS
?概念:Angular.js是一個(gè)MVC的框架,致力于解決ajax開(kāi)發(fā)過(guò)程中的問(wèn)題;由google團(tuán)隊(duì)開(kāi)發(fā);現(xiàn)在最新版本是4.1.0;文件需要放到服務(wù)器環(huán)境下執(zhí)行;
?angular支持模塊化開(kāi)發(fā);
?上課我們使用1.3.10;
?1:主版本號(hào)
?3:次版本號(hào)
?10: 修訂號(hào);
?M:model數(shù)據(jù);
?V:view視圖;
?C:controller控制器;
?官網(wǎng): angularjs.org;
angular.bind();改變this的指向;
?angular.bind(改變后的this的值,改變哪個(gè)函數(shù)的this,參數(shù)1,參數(shù)2···),改變后返回一個(gè)新的函數(shù),新函數(shù)需要調(diào)用執(zhí)行;
angularJS：
? ? 是一個(gè)MVC的框架装悲，致力于解決ajax開(kāi)發(fā)過(guò)程中的問(wèn)題
//angular.element().ready();類似于window.onload
angular.element(document).ready(function(){
var oDiv = document.getElementById('box');
angular.element(oDiv).on('click',function(){
angular.element(this).css('background','red');
})
})
function show(a,b){
alert("this:"+this+'\n'+"a:"+a+'\n'+"b:"+b);
}
//show();//window
//angular.bind 改變this指向
var c = angular.bind(12,show,"1212","3443");
c();
var arr = [1,2,3];
var arr1 = [];
//angular.copy 克隆
angular.copy(arr,arr1);
console.log(arr1);
var arr = [12232,2323,232];
//檢測(cè)arr是不是一個(gè)數(shù)組 angular.isArray; 值為布爾值
alert(angular.isArray(arr));
var oDate = new Date();
//檢測(cè)其是不是一個(gè)日期對(duì)象 angular.isDate; 值為布爾值
alert(angular.isDate(oDate));
var str1 = "wellcom to bj";
//angular.uppercase()轉(zhuǎn)大寫(xiě)
console.log(angular.lowercase(str1));
var str2 = "WELLCOM TO BJ";
//angular.lowercase()小寫(xiě)
console.log(angular.uppercase(str2));
//angular.equals();比較a,b是否相等 ?***經(jīng)過(guò)angular轉(zhuǎn)換之后 NaN == NaN
var a = NaN;
var b = NaN;
alert(angular.equals(a,b));
//angular.forEach(循環(huán)誰(shuí)诀诊，fn(key,value))循環(huán) ?value:值 key:下標(biāo)
var arr = ["tiger","monkey","dog","pig","elephent"];
angular.forEach(arr,function(value,key){
console.log(value+":"+key);
//value:值
//key:下標(biāo)
})
---------------------------------------------------------
命名空間:
以ng- 開(kāi)頭
得到數(shù)據(jù):
?ng-model="數(shù)據(jù)名字" 針對(duì)天生就產(chǎn)生數(shù)據(jù)的標(biāo)簽,比如input標(biāo)簽;
展示數(shù)據(jù):
?方法1.{{數(shù)據(jù)名字}}
?ng-bind="數(shù)據(jù)名字":好處在于錯(cuò)誤的時(shí)候不會(huì)出現(xiàn)模板標(biāo)記
開(kāi)啟angular的應(yīng)用模式:
?ng-app
?***ng-app一個(gè)頁(yè)面只能出現(xiàn)一次;
? ?解決方法:
ng-init:初始化數(shù)據(jù)
?ng-init="數(shù)據(jù)"
angular中的事件:
?去掉on,加上ng-開(kāi)頭;
?ng-click:
?ng-mouseover:
?ng-mouseout:
ng-show="true/false" 是否顯示;
ng-hide="true/false" 是否隱藏;
ng-repeat:循環(huán)
?
? ?
angular控制器:
?1:定義控制器;
1>.定義一個(gè)模塊:
var app = angular.module(模塊的名字,[依賴的模塊],配置函數(shù));
前兩個(gè)參數(shù)是必須的,最后一個(gè)不是必須的;
第二個(gè)參數(shù)如果有依賴的模塊,就寫(xiě),沒(méi)有就空著;
2>.定義一個(gè)控制器:
app.controller('控制器的名字',function($scope){
$scope.a = 12;
});
?2:使用一個(gè)控制器;
? ?ng-controller="控制器的名字"
? ?展示數(shù)據(jù):{{a}}
