Js事件绑定时，函数名加括号和不加括号有什么区别_input type="button" 慰nclick="aa()-优快云博客

本文链接：https://blog.youkuaiyun.com/dreamerzhang66/article/details/80325611

Js事件绑定时，函数名加括号和不加括号有什么区别以window.onload为列

大致可以理解为一：不加括号时：=指向函数，触发事件时触发函数。window.οnlοad=aa;aa为一个函数等价于window.οnlοad=fonction aa（）{}；

二：加上括号时：现将函数运行，在将运行后的值赋值

一，在js代码里

加括号代表调用，执行这个方法；

不加括号目的是引用,代表把这个函数赋值给某个变量。

在下面代码里：

1.1 btn.οnclick=aa;是正常绑定事件，理解为：

<input id="btn" type="button" οnclick="aa()" value="点击变色">

点击触发执行 function aa(){...};

1.2 btn.οnclick=aa（）;理解如下；

btn.onclick就相当于一个click事件的引用对象，只不过它附属于btn这个标签。

等号是赋值操作如果是对象比如A，就会把对象A的指向赋给click事件的引用对象。aa是对象指向，aa()就是执行了函数，它最终是个什么东西，就看函数体返回什么类型，function aa()里有①和②，还有一个return，那么就是 --->先把aa（）里①和②执行，在将函数bb（）return 给 btn.onclick；所以就相当于btn.οnclick=bb；

 
      [java]  
      view plaincopy
<%@ page language="java" contentType="text/html; charset=UTF-8"  
    pageEncoding="UTF-8"%>  
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>函数括号</title>  
</head>  
<body>  
  
<div id="test">函数括号那回事</div>  
<input id="btn" type="button" value="点击变色">  
  
<script type="text/javascript">  
   function aa(){  
   
       alert("function aa()函数");  //  ①   
  
       document.getElementById("test").style.color="red";  //  ②  
        
       return function bb(){ //  ③  
           alert("function aa()函数里面的function bb()！")  
      }  
   }  
   function change(){  
       var ip=document.getElementById("btn");  
       btn.οnclick=aa;   //正常绑定事件，onclick触发执行 ①弹出①对话框，②变色；不会执行③  
       //btn.οnclick=aa();  //页面加载，直接调用aa(),执行 ①弹出①对话框，②变色,但是onclick触发时，会执行③  
   }  
   change();  //调用change,直接执行  
</script>  
</body>  
</html>  