《javascript 高级程序设计》 笔记2 8~章

chapter 8 BOM（浏览器对象模型）

window对象

　　表示浏览器的一个实例。

　　

　　直接在window对象上定义的属性可以通过delete操作符删除，而全局变量不可以。

 窗口关系及框架

位置操作

    setTimeout(function(){
//        location.replace("http://www.baidu.com/"); //该方式跳转，无法"后退"到跳转前的页面；
//        window.location="http://www.baidu.com";
//        window.href="http://www.baidu.com";
        location.assign("http://www.baidu.com");
    },1000); //一秒后执行；

页面重新加载：

　　location.reload();　　//重新加载（优先从缓存加载）

　　locaiton.reload(true); //重新加载（从服务器重新加载）

navigator 对象

chapter 10 DOM （文档对象类型）

chapter 11 DOM扩展

自定义数据属性

　　

var div = document.getElementById("myDiv");
var appId=div.dataset.appId;
var myName=div.dataset.myname;
div.dataset.appId=2323;
div.dataset.myname="Michael";

chapter 13 事件

 事件处理程序

　　事件就是用户或浏览器自身执行的某种动作。事件处理程序的名字以“on”开头。

事件对象

　　

<button id="myBtn">Click</button>
<script type="text/javascript">
    var btn=document.getElementById("myBtn");
/*  btn.onclick=function(event){
        alert(event.type);
    } */
    btn.addEventListener("click",function(event){
        alert(event.type);
    });
</script>

在需要通过一个函数处理多个事件时，可以使用type属性。

    var handler=function(event){
        switch(event.type){
        case "click":
            alert("Clicked");
            break;
        case "mouseover":
            event.target.style.backgroundColor="red";
            break;
        case "mouseout":
            event.target.style.backgroundColor="";
            break;
        }
    };
    btn.onclick=handler;
    btn.onmouseover=handler;
    btn.onmouseout=handler;

事件类型

　　

UI事件：

　　

内存和性能

　　

事件委托

 　　事件委托你用了事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。

 chapter 14 表单脚本

表单基础