In this paper, we share the specific code of JS to close the small ad special effect for your reference. The specific content is as follows
Knowledge points
1. Get element
2. Get parent element from element
3. Delete node
4. Set element hide
Operation effect
Delete directly
hide
code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#box{
height: 200px;
width: 200px;
position: relative;
display: inline-block;
}
#box>#icon{
height: 100%;
width: 100%;
}
div>img:nth-child(2){
height: 30px;
width: 30px;
position: absolute;
top: 0;
right: 0;
cursor: pointer;
}
</style>
</head>
<body>
<div>
< img SRC = "images / Aru 20. GIF" ALT = >
< img SRC = "images / delete. PNG" ALT = >
</div>
<script>
window.onload = function (ev) {
//1. Get the closing tag
var close = document.querySelector('#close');
//2. Answer and click
close.onclick = function (ev1) {
//Delete directly
// this.parentElement.remove();
// this.parentNode.remove();
//Hide
this.parentElement.style.display = 'none';
// this.parentElement.setAttribute('style','display:none');
}
}
</script>
</body>
</html>The above is the whole content of this article, I hope to help you learn, and I hope you can support developer more.