Skip to content

Instantly share code, notes, and snippets.

@silavsale

silavsale/EventListner.js

Created February 22, 2020 20:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save silavsale/84b921a20186ba6ffa25ee6e103007a0 to your computer and use it in GitHub Desktop.
Save silavsale/84b921a20186ba6ffa25ee6e103007a0 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
EventListner.js
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Events - Event Delegation</title>
<link rel="stylesheet" href="./event.css">
</head>
<body>
<div id="page">
<h1>List King</h1>
<h2>Buy groceries</h2>
<ul id="shoppingList">
<li class="complete" id='1'><a href="itemDone.php?id=1">fresh figs</a></li>
<li class="complete" id='2'><a href="itemDone.php?id=2">pine nuts</a></li>
<li class="complete" id='3'><a href="itemDone.php?id=3">honey</a></li>
<li class="complete" id='4'><a href="itemDone.php?id=4">balsamic vinegar</a></li>
</ul>
</div>
<script>
var parent = document.getElementsByTagName("ul")[0];
parent.addEventListener('click', (event)=>{
event.preventDefault();
var element = document.getElementById(event.target.parentNode.id);
element.remove();
});
function getTarget(event){
return event.target||event.srcElement;
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment