Code
<style>
.floatDiv {
position:absolute; top:30px; left:30px; width:30px; height:30px; background-color:#00FFFF;
}
</style>
<script type="text/javascript">
function fn1(evt){
var obj = evt.currentTarget || evt.srcElement; //get DOMObj
var text = '<div class=\"floatDiv\" onmouseover=\"fn2(event)\" >';
text=text +'</div>';
obj.innerHTML= text;
//阻止事件起泡
if (evt.stopPropagation) evt.stopPropagation(); //DOM 2
else {evt.cancelBubble = true;} //IE
//禁止執(zhí)行默認(rèn)動作
if(evt.preventDefault) evt.preventDefault(); //DOM 2
else {evt.returnValue = false;} //IE
}
//fn2 設(shè)定為自動生成的div的onmouseover實際，并阻止該事件起泡，避免在IE下onmouseover事件
//起泡，并執(zhí)行其父容器div0的事件函數(shù)fn1;
function fn2(evt){
//阻止事件起泡
if (evt.stopPropagation) evt.stopPropagation();//DOM 2
else {evt.cancelBubble = true;} //IE
//禁止執(zhí)行默認(rèn)動作
if(evt.preventDefault) evt.preventDefault(); //DOM 2
else {evt.returnValue = false;} //IE
}
</script>
<body>
<div id="div0" name="div0Name" style="border:#FF0000 solid 1px;width:100px;height:100px; position:relative;" onmouseover="fn1(event)">
</div>
</body>
以上代碼展示了如何獲取事件的dom對象，已經(jīng)如何防止事件起泡，兼容ie6 7 ,firefox 3
Tag標(biāo)簽: 事件 dom對象 事件起泡
