onClick() 事件在JavaScript中非常流行。onClick事件仅用于在单击指定的HTML元素时触发操作、执行代码或调用函数。这个HTML元素通常是一个按钮，但也可以是ahead、iframe、label元素等。 onClick() 所有主要浏览器都支持该活动，如Google Chrome、Microsoft Edge、internetexplorer、Mozilla Firefox、Opera和Safari。

onClick（）语法

onClick事件具有非常简单的语法，其中将分配操作、JavaScript代码或函数。

• `ELEMENT`是附加给定onclick事件的HTML元素。元素通常是一个按钮或类似类型的元素，用户可以在其中单击它。
• `SCRIPT`是一个JavaScript代码，可以是一个或多个语句，也可以是一个函数调用。

用onClick（）调用函数

我们将从一个非常流行的例子开始，在这个例子中，我们将用onClick（）事件调用一个已经定义的函数。函数名为 Say_Hello() 它只会打印一个敬礼。我们只提供onClick（）事件的函数名。

Click on this text!

在onClick（）中运行代码

onClick（）事件也可以直接运行JavaScript代码，而无需调用任何函数。此代码可以是单个语句或多个语句。在本例中，我们将运行alert函数并进行一些计算。

Click on this Button To Say HelloClick on this Button To Say HelloClick on this Button To Make Calculations

如果要在onClick（）事件中使用多个语句，则必须使用 ; . 但如果只有一个说法 ; 在我们可以使用或不使用的地方是可选的。

相关文章： JavaScript“Uncaught TypeError:Cannot set property“…”of null”错误解决方案

为onClick（）函数提供参数

我们还可以为onClick（）事件调用的函数提供一些参数。我们将只调用函数并将参数放在括号内。在本例中，我们将为 Say_Hello() 功能。

Click on this Button To Say Hello

使用HTML DOM对象设置onClick（）事件

到目前为止，我们已经为onClick（）事件使用了一种简单的元素属性方式。我们还可以使用htmldom为click事件的特定HTML元素设置函数或代码。我们将设置元素DOM对象 onclick 属性。在下面的示例中，我们将设置 Say_Hello() 通过使用htmldom为button元素提供函数。

 Say Hello

使用HTML DOM对象删除onClick（）事件

我们还可以使用HTMLDOM对象删除onClick（）事件赋值。我们只需将元素的onclick属性设置为null对象，这将删除现有的赋值。在本例中，我们将删除 mybutton HTML元素onClick（）事件，如下所示。

document.getElementById("mybutton").onclick="";

使用addEventListener（）函数设置onClick（）事件

一些HTML元素提供 addEventListener() 函数，以便向给定的HTML元素添加事件。我们将只获取HTML元素的对象并使用 addEventListener() 具有事件名称和可以分配的代码的函数。onClick（）事件命名为 click 对于addEventListerner（）。我们还将提供一些JavaScript代码或函数 Say_Hello() 功能。

 Say Hello

使用addEventListener（）删除onClick（）事件  功能

我们也可以使用 addEvenListener() 函数以删除现有的单击事件代码或函数。我们将为下面的代码或函数参数清空字符串。

document.getElementById("mybutton").addEventListener("click","");