冒泡事件 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>冒泡事件</title>
    </head>
    <body onclick="Add('-BODY')">
        <div onclick="Add('-DIV')" style="padding:12px;background-color:#EFEFEF;">
            <p onclick="Add('-P');" style="background:#c00;">
                点击
            </p>
        </div>
        <div id="Console" style="border:solid 1px #ee0; background:#ffc;">
        </div>
    </body>
</html>
<script type="text/javascript">
function Add(){
    document.getElementById("Console").innerHTML += arguments[0];
}
</script>

演示浏览器中的事件冒泡效果。

留个脚印。

 

 

 

posted @ 2010-07-09 10:24  Constantin  阅读(201)  评论(0)  编辑  收藏  举报