我正在尝试在页面加载后向元素添加一个 OnClick 函数，然后让该 OnClick 函数更改单独元素的文本

Question

我试图在页面加载时向4个元素元素添加一个OnClick函数，然后让这些OnClick功能更改单独元素的文本。我尝试创建一个名为AddClick的函数，该函数指定elementID，然后设置一个OnClick属性和单独的函数。(我为每个元素做了四次，我想在点击时激活新功能。

然后我要求AddClick在页面加载时运行。

然后，我创建了一些函数来替换分离元素的旧文本。(这些应该设置为在点击元素时运行。

如果这是错误的方法，请提前道歉/如果我不清楚。第一次在这里发帖，感谢您的帮助。

对于HTML，我试图更改的文本位于带有ID的div中，但h4没有特定的ID，我无法添加。

以下是我尝试实现的JavaScript：

<script type="text/javascript">
function AddClick(){
//Name & Number
document.getElementById("o_5794738").setAttribute('onclick', "NewText()");
//Number
document.getElementById("o_5794733").setAttribute('onclick', "OldText()");
//Name
document.getElementById("o_5794723").setAttribute('onclick', "OldText()");
//None
document.getElementById("o_5794728").setAttribute('onclick', "OldText()");
};
window.onload = AddClick;
function NewText() {
document.getElementById("pt_fc_775338").getElementsByTagName(h4).innerHTML = "<h4>New Text</h4>"; 
}
function OldText() {
document.getElementById("pt_fc_775338").getElementsByTagName(h4).innerHTML = "<h4>Old Text</h4>";
}

非常感谢您的帮助。

Answer 1

你可以试试这个：

document.getElementById("demo").onclick = function() {myFunction()};

我在上找到了这个例子https://www.w3schools.com/jsref/event_onclick.asp

Answer 2

无需使用load添加click事件您可以使用.addEventListener直接添加点击事件(顺便说一句，.setAttribute不用于添加任何事件)

只需像这样使用.addEventListener：
document.getElementById("o_5794738").addEventListener('click', NewText);

有关.addEventListener()的更多信息，请阅读本文

以下是演示片段：

document.getElementById("o_5794738").addEventListener('click', NewText);
function NewText() {
document.getElementById("pt_fc_775338").getElementsByTagName("h4")[0].innerHTML = "New Text";
}

<button id="o_5794738">Click Me!</button>
<div id="pt_fc_775338">
<h4></h4>
</div>