16. HTML5脚本编程

  • 跨文档消息传递 cross-document messaging, XDM, web messaging
  • 原生拖放
    • 拖动元素时，依次发生下列事件：
      • dragstart
      • drag
      • dragend
    • 当元素被拖动到一个有效的放置目标上时，下列事件一次发生：
      • dragenter
      • dragover
      • dragleave/drop
    • 自定义放置目标
      • 取消dragover/dragenter/drop事件的默认行为preventDefault()
    • dataTransfer
    • dropEffect: none/move/copy/link
    • effectAllowed: uninitialized/none/copy/link/move/copyLink/copyMove/linkMove/all
    • 可拖动：draggable
  • 媒体元素
    • <audio>/<video>
      • audio不用必须插入到文档中。
  • 历史状态管理
    • hashchange事件
    • putState()/replaceState()
    • popstate事件
    • 不必卸载当前页面即可修改浏览器的历史状态栈
    • 用户可以通过前进和后退按钮在页面间切换

17. 错误处理与调试

  • try-catch-finally
    • 无论如何，finally总会被执行，即使有return语句
    • catch内错误对象必须有一个名字
  • 错误类型
    • Error
    • EvalError
    • RangeError 数值超出范围
    • ReferenceError 找不到对象
    • SyntaxError 语法
    • TypeError 类型
    • URIError 使用encode()和decode()时，URI格式不正确
  • 抛出错误throw
  • 错误事件error
    • window.onerror是浏览器报告错误的最后一道防线
  • 常见错误类型
    • 类型转换错误
      • var a = ""/0/undefined/null; if(a);
    • 数据类型错误
    • 通信错误
  • 致命错误和非致命错误
for(let i = 0; i < model.length; i++){
	model[i].init();
}
// 任意一个模块初始化失败，会导致后续无法进行
for(let i = 0; i < model.length; i++){
	try{
		model[i].init();
	}catch(e){
		console.log(e);
	}
}
  • 把错误记录到服务器
  • IE，event对象在事件发生时创建，在最后一个事件处理程序执行完毕后销毁，闭包也存不住。