练习1:eval()
eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
console.log("2+2") //2+2
console.log(eval("2+2")) //4
var a="var b={x:1}";
eval(a)
console.log(b.x) //1
结果： aa is not defined
var fn = function aa(){return 1+2}
console.log(aa())
应用场合1：
结果：3
var fn = "function aa(){return 1+2}"
eval(fn)
console.log(aa())
应用场合2：
如后台传：echo:"{x:1,y:2}"
返回:String
eval()后返Object
删除属性delete
绑定方式中：
html <div on事件名="函数（this）"> 不便于维护，不符合内容与行为分离的要求
取消事件默认行为
取消事件默认行为：e.preventDefault()
情况一：可以阻止点击出现#在地址栏中
<a id="keys" href="#">click me!</a>
okeys.onclick=function(e){
e.preventDefault(); //可以阻止点击出现#在地址栏中
}
情况二：表单onsubmit事件中，进行最后一次完整验证，未通过，取消提交
form.onsubmit=function(e){
var r = userName.onblur()&&password.onblur();
if(!r){
var e =window.event|| arguments[0];
if(e.preventDefault){
e.preventDefault();
}else {
e.returnValue=false;
}
}
}
情况三：H5拖住效果，取消默认行为
封装Javascript中 $
window.$=HTMLElement.prototype.$=function(selector){
return (this==window?document:this).querySelectorAll(selector);
}
nodeType 1元素节点，2属性节点，3文本节点
---------------------------------------------------------------------
事件坐标：事件发生时，鼠标的位置
相对于屏幕左上角：e.screenX | screenY
相对于文档显示区左上角：e.clientX | e.clientY
相对于事件绑定的元素：e.offsetX | e.offsetY
事件坐标：3种坐标系
1. 相对于显示器:
最大值: screen.availHeight/availWidth
鼠标位置: e.screenX/Y
2. 相对于文档显示区
最大值：window.innerHeight/Width
鼠标位置：e.clientX/x; e.clientY/y
3. 相对于父元素左上角
最大值：父元素的宽和高
鼠标位置：e.offsetX/Y
---------------------------------------------------------------------
jquery中的,$.each
$.each()是对数组，json和dom结构等的遍历，
var arr= [11,22,33,44,55]
$.each(arr,function(i,item) { //两个参数，第一个参数表示下标，第二个参数表示一维数组中的每一个数组
i //索引值
item //数组值
})
var e =window.event|| arguments[0];
var target = e.target || e.srcElement;
if(e.preventDefault){
e.preventDefault();
}else {
e.returnValue=false;
}
--------------------------------------------------------------------------------------------------------
代码加载问题，在函数自调中找不到函数：
html代码
<script src="carousel.js"></script> <script> carousel('#c1',300,180) </script>
由于先加载carousel.js文件，所以carousel("#c1",300,180)运行下边代码出错
Uncaught ReferenceError: carousel is not defined
(function(){ function carousel(selector){ alert(selector) } })()
解决：函数自调中window.carousel设置成全局
carousel.js 代码
(function(){ window.carousel =function(selector){ alert(selector) } })()
html与javascript表示方法：
$([子节点],[父节点])
html 结构如下：
<div id="c1" > <div class="carousel-wrap"></div> </div>
javascript 可这样表示：
$('.carousel-wrap','#c1');
-------------------------------------------------------------------------------------------------------
js获取浏览器可视区域的宽度
//浏览器可视区宽高,提前要加<!DOCTYPE html>
var iWinWidth = document.documentElement.clientWidth;
var iWinHeight = document.documentElement.clientHeight;
垂直方向滚动条的高度
iScrollTop = document.documentElement.scrollTop ||document.body.scrollTop （chrome支持）
-------------------------------------------------------------------------------------------------------
getComputedStyle
var computedStyle = getComputedStyle(myDiv); alert(computedStyle.backgroundColor); alert(computedStyle.width);
oaa.style.left：一般是行内left,取不到内部样式如.style{left:0}这种形式
oaa.offsetLeft：相对当前定位元素left
-------------------------------------------------------------------------------------------------------
getAttributeNode() 方法从当前元素中通过名称获取属性节点。var oh1 = document.getElementById("a"); alert(oh1.getAttributeNode("id").nodeType);//2