Capturing all DOM Events

bsnl

Feb 22nd 2009, 8:09 am

Hi, my company has a bunch of web pages on which they want to record every DOM event(mouse movement, clicks etc), these pages were written in past and now with minimal editing I need to add listener to capture these events.
Can someone provide an easy and effective way to do this (may be addition of eventlistener at Body tag to capture all bubbled up events, but i am not sure if it will work when stopPropagation method is called by some eventlistener in the chain).
I am looking for a universal listener kind of thing that can be easily integrated with my pages.
Thanks to every reader of this question

cjburkha

Feb 24th 2009, 4:59 pm

What you are asking for is very hard for two reasons:

1. Mousemove happens so often you cannot catch them all in DB
2. There are many events and IE and FF handle them different

Start with this sample, and then look to quirksmode.org
<html>
<head>
<script type="text/javascript">
function iniHandlers()
{

document.getElementById('innerDiv').onclick = clicked;
document.getElementById('mainDiv').onclick = clicked;
}

function clicked()
{
alert(this.id);
}
</script>
</head>
<body onload="iniHandlers();">
<div id="mainDiv" style="width: 100%; height: 100%; ">
<div id="innerDiv" style="width: 100px; height: 100px; border-style: solid">
</div>
</div>
</body>
</html>