HTML and CSS Reference
In-Depth Information
EXAMPLE 15.19 ( CONTINUED )
d1=document.getElementById('div1');
p1=document.getElementById('para1');
p2=document.getElementById('para2');
a1=document.getElementById('link1');
4
b1.onclick=iam;
d1.onclick=iam;
p1.onclick=iam;
p2.onclick=iam;
a1.onclick=iam;
}
5
function iam(event) {
if (!e){
e = window.event;
6
e.cancelBubble = true ;/* Microsoft IE */
}
else{
7
e.stopPropagation(); /* W3C */
}
// stop all other targets with event listeners from
// triggering this event
}
</script>
</head>
8 <body id="bdy1">
<h2>Bubble bubble...</h2>
<div id="div1">
9 <p id="para1">Some text in a paragraph element.</p>
<p id="para2">Another paragraph element with text.
10 <a id="link1" href="#">link</a>
</p>
</div>
</body>
</html>
EXPLANATION
1
Global variables are declared that will be used in the function that follows.
2
Once the page has loaded the onload event handler is triggered, causing the anon-
ymous function to be executed.
3
The document.getElementById() method returns references to all of the HTML el-
ements with id attributes.
4
Each of the element references is assigned the onclick event property and its value,
a function called iam() .
Search WWH ::




Custom Search