Skip to content

Commit 8554302

Browse files
saiprasadm45saiprasadm45
committed
logic building
1 parent 821adf4 commit 8554302

File tree

1 file changed

+46
-0
lines changed

1 file changed

+46
-0
lines changed

‎08_Events/DeleteImage.html‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Delete Images</title>
7+
</head>
8+
<body style="background-color: #414141; color: aliceblue;">
9+
<h2>Amazing image</h2>
10+
<div>
11+
<ul class="images">
12+
<li><img width="200px" id="photoshop"
13+
src="https://images.pexels.com/photos/3561339/pexels-photo-3561339.jpeg?auto=compress&cs=tinysrgb&w=1600&lazy=load"
14+
alt="photoshop"></li>
15+
<li><img width="200px" id="japan"
16+
src="https://images.pexels.com/photos/3532553/pexels-photo-3532553.jpeg?auto=compress&cs=tinysrgb&w=1600&lazy=load"
17+
alt=""></li>
18+
<li><img width="200px" id="river"
19+
src="https://images.pexels.com/photos/3532551/pexels-photo-3532551.jpeg?auto=compress&cs=tinysrgb&w=1600&lazy=load"
20+
alt=""></li>
21+
<li><img width="200px" id="owl"
22+
src="https://images.pexels.com/photos/3532552/pexels-photo-3532552.jpeg?auto=compress&cs=tinysrgb&w=1600&lazy=load"
23+
alt=""></li>
24+
<li><img width="200px" id="prayer"
25+
src="https://images.pexels.com/photos/2522671/pexels-photo-2522671.jpeg?auto=compress&cs=tinysrgb&w=1600&lazy=load"
26+
alt=""></li>
27+
<li><a style="color: aliceblue;" href="https://google.com" id="google">Google</a></li>
28+
</ul>
29+
</div>
30+
<script>
31+
32+
document.querySelector('.images').addEventListener('click',(e)=>{
33+
if(e.target.tagName == 'IMG'){
34+
let removeit = e.target.parentNode
35+
// removeit.remove() it also works
36+
removeit.parentNode.removeChild(removeit)
37+
}
38+
if(e.target.tagName == 'A'){
39+
e.preventDefault()
40+
}
41+
})
42+
43+
44+
</script>
45+
</body>
46+
</html>

0 commit comments

Comments
 (0)