如何使用 JavaScript 在单击子元素时关闭父 div？

Question

我有四个具有相同类但不同 Id 的 div 元素。在每个 div 中，我有一个段落元素和一个跨度元素。跨度具有相同的类但不同的 id。在跨度内，我使用 fa-times(close) 图标来关闭外部 div。如何用 JavaScript 做到这一点？我尝试使用类名声明变量，但它返回一个 HTML 集合数组。但是，我可以通过从数组内部定位每个元素来隐藏父 div。但我知道这是错误的方法。代码function close() {  var clost = document.getElementsByClassName('span');  clost[0].parentElement.style.display = 'none';}<div class="div" id="div_1">  <p>Please Enter a Keyword</p>  <span class="span" onclick="close()" id="span_1"><i class="fa fa-times" aria-hidden="true"></i></span></div><div class="div" id="div_2">  <p>Enter your name</p>  <span class="span" onclick="close()" id="span_2"><i class="fa fa-times" aria-hidden="true"></i></span></div><div class="div" id="div_3">  <p>Enter your city</p>  <span class="span" onclick="close()" id="span_3"><i class="fa fa-times" aria-hidden="true"></i></span></div><div class="div" id="div_4">  <p>Enter your country</p>  <span class="span" onclick="close()" id="span_4"><i class="fa fa-times" aria-hidden="true"></i></span></div>错误：找不到未定义的父级预期结果：单击 fa 图标时，所有 div 都应单独关闭。”