《复习笔记》
一、ajax
ajax:无刷新从服务器取数据;
缓存:浏览器针对同一个网址只会访问一次
ajax防止缓存方法:
添加随机数【随机因子】
ajax注意:文件编码格式要保持一直
从后台取数据传过来的都是字符串
ajax:不允许跨域取数据
创建post请求:
oAjax.open('post',url,true);
oAjax.setRequestHeader('Content-type','Application/x-www-form-urlencoded');
oAjax.send(json2url(json.data));
创建get请求:
oAjax.open('get',urk,true);
oAjax.send();
转换data格式:
function json2url(json){
var arr = [];
for(var name in json){
arr.push(name + '=' + json[name])
}
return arr.join('&');
}
eval:就是把字符串解析成js可移执行的任何代码
jsonp:跨域取数据
实现原理:动态添加script标签
script:是一次性标签;改变src属性需要重新加载执行
onkeydown:键盘按下事件
onkeyup:键盘抬起事件
event:存储或描述事件更加详细的信息
event.clientX;
event.clientY;
event.keyCode;
event.cancelBubble = true;//兼容低版本IE 阻止事件冒泡
event.stopprapagation //标准浏览器 阻止事件冒泡
事件冒泡:
子元素的事件可以传递给父元素,如果父元素有相同的事件,会触发,否则会继续往上冒泡
事件捕获:Obj.setCapture();//IE独有的
把多有的精力都放到某一个事件上,点击页面任何地方都相当域在点 击这个按钮;
释放捕获:obj.releaseCapture();//IE独有的;
事件绑定[监听]:
obj.addEventListener(事件名,函数名,false);事件名不加on;
obj.attachEvent(事件名,函数名);事件名必须加on;
同一个元素,同一个事件,需要执行不同的方法;
删除事件绑定:
obj.removeEventListener(事件名,函数名,false);//事件名不加on;
obj.detachEvent(on+"事件名",函数名);
事件委托:
把子元素的事件委托给父元素来执行;
oTarget = oEvent.srcElement || oEvent.target;
if(oTarget.targName == 'UL'){
//code
}
阻止事件:
组织事件的兼容写法:
1、if(event.preventDfault){
event.preventDefault();//标准浏览器
}else{
event.returnValue=false;//IE浏览器
}
2、return false 常用的组织事件方式,但后面的代码不会再触发
事件移除:removeEventListener(event,function);
事件源:
IE:?window.event.srcElement
标准:event.target;
-----------------------------------------------------------------------------------
键码:
ctrl:ctrlKey
shift:shiftKey
alt:altKey
-----------------------------------------------------------------------------------
jsonp:
跨域取数据;
script是一次性的;src属性需要加载执行;
事件冒泡:
子元素的事件可以传递给父元素,父元素有相同事件会执行,否则会一直网上冒泡;
取消事件冒泡:
oEvent.cancelBubble = true;
事件捕获:
obj.setCapture();IE独有的;
事件释放捕获:
obj.releaseCapture();IE独有的;
事件绑定:
obj.addEventListener(sEv,fn,false);-->事件名不加on;
obj.attachEvent('on'+sEv,fn); --->事件名必须加on;
事件解除绑定:
obj.removeEventListener(sEv,fn,false);--->事件名不加on;
obj.detachEvent('on'+sEv,fn); --->事件名必须加on;
事件委托:
把子元素的事件委托给父元素来执行;
oTarget = oEvent.srcElement || oEvent.target;
if(oTarget.tagName == 'UL'){
//code;
}
------------------------------------------------------------------------------------
键码:
ctrl:ctrlKey
shift:shiftKey
alt:altKey
----------------------------------------------
AngularJS
概念:Angular.js是一个MVC的框架,致力于解决ajax开发过程中的问题;由google团队开发;现在最新版本是4.1.0;文件需要放到服务器环境下执行;
angular支持模块化开发;
上课我们使用1.3.10;
1:主版本号
3:次版本号
10: 修订号;
M:model数据;
V:view视图;
C:controller控制器;
官网: angularjs.org;
angular.bind();改变this的指向;
angular.bind(改变后的this的值,改变哪个函数的this,参数1,参数2···),改变后返回一个新的函数,新函数需要调用执行;
angularJS:
是一个MVC的框架,致力于解决ajax开发过程中的问题
//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];
//检测arr是不是一个数组 angular.isArray; 值为布尔值
alert(angular.isArray(arr));
var oDate = new Date();
//检测其是不是一个日期对象 angular.isDate; 值为布尔值
alert(angular.isDate(oDate));
var str1 = "wellcom to bj";
//angular.uppercase()转大写
console.log(angular.lowercase(str1));
var str2 = "WELLCOM TO BJ";
//angular.lowercase()小写
console.log(angular.uppercase(str2));
//angular.equals();比较a,b是否相等 ***经过angular转换之后 NaN == NaN
var a = NaN;
var b = NaN;
alert(angular.equals(a,b));
//angular.forEach(循环谁,fn(key,value))循环 value:值 key:下标
var arr = ["tiger","monkey","dog","pig","elephent"];
angular.forEach(arr,function(value,key){
console.log(value+":"+key);
//value:值
//key:下标
})
---------------------------------------------------------
命名空间:
以ng- 开头
得到数据:
ng-model="数据名字" 针对天生就产生数据的标签,比如input标签;
展示数据:
方法1.{{数据名字}}
ng-bind="数据名字":好处在于错误的时候不会出现模板标记
开启angular的应用模式:
ng-app
***ng-app一个页面只能出现一次;
解决方法:
ng-init:初始化数据
ng-init="数据"
angular中的事件:
去掉on,加上ng-开头;
ng-click:
ng-mouseover:
ng-mouseout:
ng-show="true/false" 是否显示;
ng-hide="true/false" 是否隐藏;
ng-repeat:循环
angular控制器:
1:定义控制器;
1>.定义一个模块:
var app = angular.module(模块的名字,[依赖的模块],配置函数);
前两个参数是必须的,最后一个不是必须的;
第二个参数如果有依赖的模块,就写,没有就空着;
2>.定义一个控制器:
app.controller('控制器的名字',function($scope){
$scope.a = 12;
});
2:使用一个控制器;
ng-controller="控制器的名字"
展示数据:{{a}}