javascript event bubbling example analysis

  • 2020-06-15 07:35:27
  • OfStack

This article is an example of an javascript event bubbling. Share to everybody for everybody reference. The specific analysis is as follows:

Event bubble:

If the element A is nested within the element B, then the click on A will trigger not only the onclick event of A, but also onclick of B,

Verify: Add 1 table to the page, tr in table, td in tr, p in td,

In p td tr, table add incident response


<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> The event bubbling </title>
</head>
<body onclick="alert('body click');">
  <table onclick="alert('table click');">
    <tr onclick="alert('tr click');">
      <td onclick="alert('td click');">
        <input type="button" value=" Click on the I " 
        onclick="alert('button click');" />
      </td>
    </tr>
  </table>
</body>
</html>

Hopefully, this article has been helpful in your javascript programming.


Related articles: