Hallo, ich habe gerade in meinem Buch etwas über Event-Bubbling und Event-Capturing gelesen und dachte mir, dass probiere ich doch gleich mal mit dem folgenden Code aus:
Ich hätte nun vermutet, dass wenn ich auf den Paragraphen mit der id vier klicke, dass anschließend noch 'drei' und 'zwei' in einem alert-Fenster ausgegeben wird. Meine Frage ist nun: Warum passiert das nicht? Das <p>-Tag vier ist ja in der Hierarchie der drei untergeordnet und die drei ist der zwei untergeordnet. Trotzdem passiert nichts..
Viele Grüße :)
HTML:
<!DOCTYPE html>
<html>
<head>
<title>DOM-Test</title>
<style type="text/css" media="screen">
#zwei {
background-color: blue;
}
#drei {
background-color: green;
}
#vier {
background-color: yellow;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<form id="eins">
<p id="zwei" onclick="alert('2');" onclick="alert('zwei');">
Zwei Zwei Zwei Zwei Zwei
Zwei Zwei Zwei Zwei Zwei
Zwei Zwei Zwei Zwei Zwei
<p id="drei" onclick="alert('3');" onclick="alert('drei');">
Drei Drei Drei Drei
Drei Drei Drei Drei
Drei Drei Drei Drei
Drei Drei Drei Drei
<p id="vier" onclick="alert('4');" onclick="alert('vier');">
Vier Vier Vier Vier
Vier Vier Vier Vier
Vier Vier Vier Vier
Vier Vier Vier Vier
</p>
</p>
</p>
</form>
</body>
</html>Ich hätte nun vermutet, dass wenn ich auf den Paragraphen mit der id vier klicke, dass anschließend noch 'drei' und 'zwei' in einem alert-Fenster ausgegeben wird. Meine Frage ist nun: Warum passiert das nicht? Das <p>-Tag vier ist ja in der Hierarchie der drei untergeordnet und die drei ist der zwei untergeordnet. Trotzdem passiert nichts..
Viele Grüße :)
