Function invocation operator函数调用操作符


function displayMessage() {

const html = document.querySelector('html');

const panel = document.createElement('div');
panel.setAttribute('class', 'msgBox');
html.appendChild(panel);

const msg = document.createElement('p');
msg.textContent = 'This is a message box';
panel.appendChild(msg);

const closeBtn = document.createElement('button');
closeBtn.textContent = 'x';
panel.appendChild(closeBtn);

closeBtn.onclick = function() {
  panel.parentNode.removeChild(panel);
}
}

btn.onclick = displayMessage();
btn.onclick = displayMessage;

含括号的函数会立即执行, 不含括号的只是个函数,而不执行。

换句话说,小括号相当于是 执行函数,返回结果给 btn.onclick, 而不含小括号的,只是传递函数给btn.onclick。
这个不含小括号的 displayMessage 也可用一个匿名函数来代替。


上面的方式没有括号,那就不能带参数,那么这种方式就不太适应。
function displayMessage(){}
function displayMessage(msgText, msgType){}


btn.onclick = function() {
  displayMessage('Woo, this is a different message!');
};
阅读量: 496
发布于:
修改于: