가장 간단한 거품 사건 및 거품 사건 저지

html 코드

    <script id="jquery_183" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.8.3.min.js"></script>
<div id="div1" style="height:200px;width:200px;background-color:#f0f8fc" onclick="funcDiv1();">
    <span></span>
  <div id="div2" style="height:100px;width:100px;background-color:#959595" onclick="funcDiv2(event);">
        <span></span>
        <div id="div3" style="width:50px;height:50px;background-color:#5079BB" onclick="funcDiv3();">
        <span></span>
        </div>
    </div>
</div>

javascript 코드

function funcDiv1(){
    $('#div1 span:first').html('aaa');
}
function funcDiv2(event){
    //console.log('a');
    event.stopPropagation();
$('#div2 span:first').html('bbb');
}
function funcDiv3(){
$('#div3 span:first').html('ccc');
}

위쪽이 통과한다.stopPropagation() 메서드로 거품 이벤트 구성