在悬停不同元素时显示div，如果鼠标指针移出刚才显示的div，则将其关闭

<div id="element1">Element 1</div>
<div id="element2">Element 2</div>
<div id="tooltip">Tooltip Content</div>

#tooltip {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  padding: 10px;
  border: 1px solid #ccc;
}

// 获取需要悬停的元素和要显示的div
var element1 = document.getElementById("element1");
var element2 = document.getElementById("element2");
var tooltip = document.getElementById("tooltip");

// 给每个元素添加悬停事件监听器
element1.addEventListener("mouseover", showTooltip);
element2.addEventListener("mouseover", showTooltip);

// 定义显示div的函数
function showTooltip() {
  // 显示div
  tooltip.style.display = "block";
  
  // 设置div的位置为鼠标指针当前位置
  tooltip.style.left = event.clientX + "px";
  tooltip.style.top = event.clientY + "px";
}

// 给div添加鼠标移出事件监听器
tooltip.addEventListener("mouseout", hideTooltip);

// 定义关闭div的函数
function hideTooltip() {
  // 隐藏div
  tooltip.style.display = "none";
}