一般利用这些事件与document.hasFocus()方法和document.activeElement属性配合。主要有：
blur：元素失去焦点，不会冒泡；
DOMFocusIn：同HTML事件focus，于DOM3遭废弃，选用focusin；
DOMFocusOut：同HTML事件blur，于DOM3遭废弃，选用focusout；
focus：元素获得焦点，不回冒泡；
focusin：获得焦点，与HTML事件focus等价，但会冒泡；
focusout：失去焦点，与HTML事件blur等价；
如：
window.onfocus = function () { console.log('focus'); //focus console.log(document.hasFocus()); //True } window.onblur = function () { console.log('blur'); //blur console.log(document.hasFocus()); //False }
当焦点从页面中的一个元素转移到另一个元素会触发下面的事件：
focusout --> focusin --> blur --> DOMFocusOut --> focus --> DOMFocusIn
鼠标事件
DOM3级事件中定义了9个鼠标事件：
click dblclick mousedown：用户按下任意鼠标按钮时触发，不能通过键盘触发这个事件； mouseup：用户释放鼠标按钮时触发，不能通过键盘触发这个事件； mousemove：不能通过键盘触发这个事件； mouseenter：不冒泡，且光标移动到后代元素上不会触发； mouseleave：不冒泡，且光标移动到后代元素上不会触发； mouseover：光标移动到后代元素上会触发； mouseout：光标移动到后代元素上会触发；
举例如下：
div.onmouseover = function() { console.log('mouseover'); //在子元素上会触发 } div.onmouseout = function() { console.log('mouseout'); //在子元素上会触发 } div.onmouseenter = function() { console.log('mouseenter'); //在子元素上不会触发 } div.onmouseleave = function() { console.log('mouseleave'); //在子元素上不会触发 }
只有在同一个元素上相继除法mousedown和mouseup事件，才会触发click事件；只有触发两次click事件，才会触发依次dblclick事件。
顺序如下：
mousedown --> mouseup --> click --> mousedown --> mouseup --> click --> dblclick
IE8之前的版本中有一个bug，在双击事件中，会跳过第二个mousedown和click事件
滚轮事件
客户区坐标位置clientX和clientY属性
如：
window.onmousemove = function() { clickX = event.clientX; clickY = event.clientY; var div = document.createElement("img"); div.src = "hhh.gif" div.style.position = "absolute"; div.style.width = '100px'; div.style.left = clickX + "px"; div.style.top = clickY + "px"; document.body.appendChild(div); };
页面坐标位置pageX与pageY；
window.onclick = function() { clickX = event.pageX; clickY = event.pageY; var div = document.createElement("img"); div.src = "ppp.png" div.style.position = "absolute"; div.style.width = '100px'; div.style.left = clickX + "px"; div.style.top = clickY + "px"; document.body.appendChild(div); };
在IE8及更早版本中不支持这个页面坐标位置，可以计算出来，需要用到混合模式下的document.body和标准模式下的document.documentElement中的scrollLeft和scrollTop属性：
if (clickX === undefined) { clickX = event.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft); }; if (clickY === undefined) { clickY = event.clientY + (document.body.scrollTop || document.documentElement.scrollTop); };
屏幕坐标位置screenX和screenY；
通过该属性可以获得相对于屏幕的坐标。
修改键
修改键有Shift、Ctrl、Alt、Meta（window上的Windows键，苹果机上的Cmd键）；对应的修改键的状态是shiftKey、ctrlKey、altKey、metaKey，这些属性包含的都是布尔值，如果相应的键被按下了，则为true，否则为false。如：
var array = []; var timing = setTimeout(showArray, 100); window.onclick = function() { if (event.shiftKey) { array.push("shift"); }; if (event.ctrlKey) { array.push("ctrl"); }; if (event.altKey) { array.push("alt"); }; if (event.metaKey) { array.push("meta"); }; }; function showArray() { var str = array.toString(); var newP = document.createElement("p"); newP.appendChild(document.createTextNode(str)); document.body.appendChild(newP); timing = setTimeout(showArray, 1000); }
相关元素
event.relatedTarget与event.target；
relatedTarget属性提供了相关元素的信息。这个属性只对于mouseover和mouseout事件才包含值；对于其他事件的值则是null；IE8之前的版本不支持relatedTarget属性，在mouseover事件触发时，IE的fromElement属性中保存了相关元素；在mouseout事件触发时，IE的toElement属性中保存着相关元素。
如：
var dot = document.getElementById("dot"); dot.onmouseout = function (){ console.log("mouse out from" + event.target.tagName + "to" + event.relatedTarget.tagName); };
如：