js按钮提示

<button title="点击发送消息">发送</button>

<button id="myButton">悬停查看提示</button>
<div id="tooltip" class="tooltip">这是一个提示信息！</div>

.tooltip {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
}

.tooltip::after {
  content: "";
  position: absolute;
  top: 100%; /* Position arrow at top edge of tooltip */
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}

document.addEventListener('DOMContentLoaded', function() {
  var button = document.getElementById('myButton');
  var tooltip = document.getElementById('tooltip');

  button.addEventListener('mouseover', function(event) {
    tooltip.style.visibility = 'visible';
    tooltip.style.left = event.pageX + 'px';
    tooltip.style.top = event.pageY + 'px';
  });

  button.addEventListener('mouseout', function() {
    tooltip.style.visibility = 'hidden';
  });
});