JS to close small advertising effects

Time:2021-3-6

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.