html+css+js实际运用问题

遇到的现象和发生背景，请写出第一个错误信息

html+css+js 使用onmouseout与onmouseover

用代码块功能插入代码，请勿粘贴截图。 不用代码块回答率下降 50%

 <td id="head">头痛td>
    tr>
    <tr>
      <td id="throat">喉咙痛td>
    tr>
    <tr>
      <td id="back">腰痛td>
    tr>
    <tr>
      <td id="stomach">肚子痛td>
    tr>
  tbody>
table>
  <div class="detail1">   感染新冠后的头疼，临床表现为一侧或双侧枕部持续性钝痛，并伴阵发性加剧，可向头顶或外耳部放射div>
    <script>
        var head=document.getElementById("head");
        var detail1=document.getElementsByClassName("detail1");
        head.onmouseover.function(){
            detail1.style.display="block";
        }
        head.onmouseout.function(){
            detail1.style.display="none";
        }
    script>

运行结果及详细报错内容

我的解答思路和尝试过的方法，不写自己思路的，回答率下降 60%

为什么这个script里面写的onmouseover函数没有实际效果

我想要达到的结果，如果你需要快速回答，请尝试 “付费悬赏”

```javascript
// 方法1
head.onmouseover=function(){
            detail1.style.display="block";
        }
// 方法2
head.addEventListener('mouseover',function(){
            detail1.style.display="block";
        })

```

• 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7748529
• 这篇博客你也可以参考下：html 修改外部引用的css或js文件，浏览器有缓存未更新【解决】
• 这篇博客也不错, 你可以看下html 修改外部引用的css或js文件，浏览器有缓存未更新【解决】