1、解绑事件
（1）用什么方式绑定事件，就应该用对应的方式解绑事件
对象.on事件名字=事件处理函数-----绑定事件
对象.on事件名字=null;
（2）对象.addEventListener（"没有on的事件类型"，命名函数，false）;---绑定事件
对象.removeEventListener（"没有on的事件类型"，命名函数，false）;---解绑事件
（3）对象.attachEvent（"on事件类型"，命名函数）;---绑定事件
对象.detachEvent（"没有on事件类型"，命名函数）;---解绑事件
2、解绑事件兼容代码
function removeEventListener(element,type,fnName){
if(element.removeEventListener){
element.removeEventListener(type,fnName,false);
}else if(element.detachEvent){
element.detachEvent("on"+type,fnName);
}else{
element["on"+type]=null;
}
}
3、冒泡事件
事件捕获1：从外向里 事件目标2：最开始选择的哪个 事件冒泡3：从里像外
阻止事件冒泡：
window.event.cancleBubble=true; 谷歌、IE支持，火狐不支持
事件参数对象(e).stopPropagation(); 谷歌、火狐支持
window.event和e都是事件参数对象
4、为同一个元素绑定多个不同事件，指向同一个事件处理函数
my$("btn").onclick=f1;
my$("btn").mouseover=f1;
my$("btn").mouseout=f1;
function f1(e){
switch (e.type){
case "click":alert("哈哈");break;
case "mouseover":this.style.backgroundColor="red";break;
case "mouseout":this.style.backgroundColor="";break;
}
}
5、 百度大项目
<div id="box">
<input type="text" id="txt" value="">
<input typr="button" value="搜索" id="btn">
</div>
<script src="common.js"></script>
<script>
var keyWords=["哈哈"，"嘿嘿"];
my$("txt").onkeyup=function(){
if(my$("dv")){
my$("box").removeChild(my$("dv"));
}
var text=this.value;
var tempArr=[];//临时数组，存放对应上的数据
for(var i=0;i<keyWords.length;i++){
if(keyWords[i].indexOf(text)==0){
tempArr.push(keyWords[i]);//追加
}
}
if(this.value.length==0||tempArr.length==0){
if(my$("dv")){
my$("box").removeChild(my$("dv"));
}
return;
}
var dvObj=document.createElement("div");
my$("box").appendChild(dvObj);
dvObj.style.width="350px";
dvObj.style.border="1px solid green";
for(var i=0;i<tempArr.length;i++){
var pObj=document.createElement("p");
dvObj.appendchild(pObj);
setInnerText(pObj,tempArr[i]);
pObj.style.margin=0;
pObj.style.padding=0;
pObj.style.cursor="pointer";
pObj.style.marginTop="5px";
pObj.style.marginLeft="5px";
pObj.onmouseover=function(){
this.style.backgroundColor="yellow";
};
pObj.onmouseover=function(){
this.style.backgroundColor="";
};
}
};
</script>
6、BOM(操作浏览器)
（1）onload---加载完毕执行
（2）onunload--页面关闭后才触发 onbeforeunload---页面关闭之前触发的
7、location
（1）属性
window.location.hash 地址栏上#及后面的内容
window.location.host 主机名及端口号
window.location.hostname 主机名
window.location.pathname 文件路径---相对路径
window.location.port 端口号
window.location.protocol 协议
window.location.search 搜索的内容
window.location.href 设置跳转的页面地址
（2）方法
location.assign
location.reload 重新加载--刷新
location.replace 没有历史记录
8、history
back()---后退 forword()---前进 go()---正数前进负数后退
9、navigator
navigator.platform---判断浏览器所在系统平台类型
navigator.userAgent---判断用户浏览器类型
10、定时器
参数1：函数 参数2：时间---毫秒
var timeId=setInterval(function(){
alert("hello");
},1000);
document.getElementById("btn").onclick=function(){
window.clearInterval(timeId)
};
11、图片晃动
<input type="button" value="摇起来" id="btn1"/>
<input type="button" value="停止" id="btn2"/>
<div id="dv">
<img src=""/>
<img src=""/>
</div>
<script src="common.js"></script>
<script>
my$("btn1").onclick=function(){
timeId=setInterval(function(){
var x=parseInt(Math.random()*100+1);
var y=parseInt(Math.random()*100+1);
my$("dv").style.left=x+"px";
my$("dv").style.top=y+"px";
},10);
};
my$("btn2").onclick=function(){
clearInterval(timeId);
};
</script>
12、星星亮起来
<input type="button" value="亮起来" id="btn"/>
<div id="dv"></div>
<script src="common.js"></script>
<script>
my$("btn").onclick=function(){
setInterval(function(
my$("dv").innerHTML=<span>*</span>;
var x=parseInt(Math.random()*600+1);
var y=parseInt(Math.random()*600+1);
my$("dv").firstElementChild.style.left=x+"px";
my$("dv").firstElementChild.style.ltop=y+"px";
),10);
};
</script>
13、美女时钟
<img src="meimei/00-00.jpg" id="im"/>
<script src="common.js"></script>
<script>
function f1(){
function(){
var dt=new Date();
var hour=dt.getHour();
var second=dt.Seconds();
hour=hour<10?"0"+hour:hour;
hour=second<10?"0"+second:second;
my$("im").src="meimei/"+hour+"-"+second".jpg";
}
}
f1();
//页面加载完毕后，过了1秒执行函数
setInterval(f1,1000);
</script>