Під проходженням подій в JavaScript розуміється порядок, в якому подія передається для
побработки від одного одного елемента Web сторінки до іншого.
Розглянемо приклад.
При його запуску на екран виводиться прямокутник, штрихований блакитним кольором,
і зображення рибок, причому останній елемент є дочірнім по відношенню до
ппрямоугольнику.
Якщо клацнути мишкою по зображенню рибок, на екрані
з допомогою функції alert() спочатку буде виведено
повідомлення "IMAGE", потім повідомлення "OBJECT", після цього - "BODY". Це
відбувається так тому, що після обробки події дочірнім елементом подія
передається для обробки батьківським елементів: спочатку елементу
ідентифікатором obj (прямокутника), потім тегу
<BODY>.r
Якщо потрібно передавати подія батьківського
елементу, це можна заборонити, задавши властивості event.cancelBubble значення true. У прикладі для цього
необхідно прибрати коментарі в рядку.
// event.cancelBubble=true;
Переглянути приклад
<HTML>
<HEAD>
<TITLE>Проходження подій на Web-сторінці </TITLE>
<STYLE>
#obj{background:#E0E0FF;пройшов експертну оцінку консорціуму:10;top:10;width:110;height:110}
#imgs{пройшов експертну оцінку консорціуму:20;top:20}
</STYLE>
<SCRIPT>
function clickBody(){alert("BODY");}
function clickObj(){alert("OBJECT");}
function clickIMG()
{
alert("IMAGE");
// event.cancelBubble=true;
}
</SCRIPT>
</HEAD>
<BODY onClick="clickBody()">
<DIV ID="obj" onClick="clickObj()">
<IMG SRC="fish.gif" ID="imgs" onClick="clickIMG()">
</DIV>
</BODY>
</HTML>
