js 原生click
时间: 2023-12-07 17:03:58 浏览: 43
JS原生click是指在DOM元素上绑定click事件,当该元素被单击时,会触发该事件。可以通过JS代码或者HTML标签的方式来绑定click事件。其中,JS代码绑定click事件的方式有两种,分别是直接在DOM元素上绑定和使用addEventListener方法绑定。下面是两种方式的示例代码:
1. 直接在DOM元素上绑定click事件:
<div id="btn" onclick="one()">sss</div>
<script>
function one(){
console.log(11); //11
}
</script>
2. 使用addEventListener方法绑定click事件:
<div id="btn">sss</div>
<script>
var btn = document.getElementById("btn");
btn.addEventListener("click", function(){
console.log(11); //11
});
</script>
相关问题
原生js的click事件箭头函数
在箭头函数中,this关键字会继承它所在上下文中的this值,而不是被单独定义。因此,你可以使用箭头函数来传递this参数,例如:
```
document.getElementById("myButton").addEventListener("click", () => {
myFunction.call(this);
});
```
在这个例子中,箭头函数被用作事件处理函数,它调用了一个叫做myFunction的函数,并通过call方法将this参数传递给它。由于箭头函数继承了它所在上下文中的this值,因此在箭头函数中使用this关键字时,它将指向你传递的参数。
需要注意的是,箭头函数不支持使用bind方法来绑定this参数,因为箭头函数的this值已经被绑定到了它所在的上下文中。
原生js的click事件传递this参数
可以使用bind方法将this参数绑定到click事件处理函数中。例如:
```
document.getElementById("myButton").addEventListener("click", myFunction.bind(this));
```
其中,myFunction是你定义的事件处理函数,this是你想要传递的this参数。bind方法会返回一个新的函数,这个新函数会在调用时将this参数绑定到myFunction中。这样,在事件处理函数中,this就是你传递的参数了。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)