Onclick无法处理表格单元格？

Question

我目前正在尝试制作一个tic tac脚趾板，但它不受JavaScript的innerHTML功能的影响。我试图改变第一个单元格内的h1，它是空的，当单元格被点击时说X，但它不起作用。任何帮助表示赞赏。

function click1() { 
 
    document.getElementById("text1").innerHTML = "X"; 
 
}

* { 
 
    position: relative; 
 
    top: 0; 
 
    bottom: 0; 
 
    right: 0; 
 
    left: 0; 
 
    margin: auto; 
 
} 
 
table { 
 
    height: 300px; 
 
    width: 300px; 
 
} 
 
td { 
 
    border: 1px solid black; 
 
    
 
}

<table> 
 
    <tr> 
 
    <td id="1" onclick="click1"><h1 id="text1"></h1></td> 
 
    <td></td> 
 
    <td></td> 
 
    </tr> 
 
    <tr> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    </tr> 
 
    <tr> 
 
    <td></td> 
 
    <td></td> 
 
    <td></td> 
 
    </tr> 
 
</table>

Answer 1

不要传递给函数的引用，而不是通过调用函数

<td id="1" onclick="click1()"><h1 id="text1"></h1></td> 

这是how it works

Answer 2

据我你有一点认识在CSS中调用onclick事件的整个函数。

它应该是这样的：

<td id="1" onclick="click1()"><h1 id="text1"></h1></td>