今天，看一个国外网站发现人家获取head元素如下
复制代码
代码如下:
var head = document.head || document.getElementsByTagName('head')[0];
后面的是我们常用的方式，前面的 document.head 着实第一次见。查资料发现原来是html5的东东。的确简单了，一个属性搞定。
当然，IE6/7/8不支持。IE9/Safari/Chrome/FF/Opera均支持（最新版本）。记录下。
html4中HTMLDocument接口如下
html5中HTMLDocument接口如下
最近写一个HTML5的游戏框架。今天写到一个多层点击事件的监听。觉得还是挺好玩的。于是把它从模块中抽化出来了。以下只是些思想。具体实现肯定不是那么丑陋
复制代码
代码如下：
<！doctype html> <html lang =“ zh - CN ”> <head> <meta charset =“ UTF-8”> <title>文档</ title> <style type =“ text / css”> .box> canvas {位置绝对 } </ style> </ head> <body> <div class =“ box”> <canvas id =“ layer1” width =“ 200” height =“ 200”> </ canvas> <canvas id =“ layer2” width =“ 500” height =“ 500”> </ canvas> </ div> <script type =“ text / javascript”>函数getRect（obj）{ var x1 = obj.offsetLeft; var y1 = obj.offsetTop; var x2 = x1 + obj.offsetWidth; var y2 = y1 + obj.offsetHeight; return { x1：x1，y1：y1，x2：x2，
y2：y2 }; }函数内部（x，y，rect）{ if（x> rect.x1 && x <rect.x2 && y> rect.y1 && y <rect.y2）{返回true; } else {返回false；} } var trigger = {}; trigger.list = []; trigger.listen = function（）{ var list = trigger.list; document.addEventListener（'click'，function（evt）{ for（var i = 0; i <list.length; ++ i）{ list [i]（evt）; } }））; }; trigger.listen（）; var l1 = document.getElementById（'layer1'）; var l2 = document.getElementById（'layer2'）; var dl1 = function（evt）{ if（inside（evt.clientX，evt。
console.log（'click'）; } } trigger.list.push（dl1）; var dl2 = function（evt）{ if（inside（evt.clientX，evt.clientY，getRect（l2）））{ console.log（'click2'）; } } trigger.list.push（dl2）; </ script> </ body> </ html>
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h60555.shtml
