Question

我只是试图通过单击功能真正的初学者来更改font属性，但是我想检查元素是否已被第二次单击，如果可以，请执行某些操作。

var clicks = 0;
document.getElementById('button2').click(function(){
  clicks++;
  if(clicks%2===0){
    document.getElementById('demo2').style.fontSize='22px';
  } else{
    document.getElementById('demo2').style.fontSize='12px';
  }
});

我在做什么错了？

Answer 1

为什么不使用事件监听器呢？

根据mozilla文档（https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click），click函数不能使用定义点击行为的函数。

请尝试以下操作：

var clicks = 0;
document.getElementById('button2').addEventListener('click', function(){
  clicks++;
  if(clicks%2===0){
    document.getElementById('demo2').style.fontSize='22px';
  } else{
    document.getElementById('demo2').style.fontSize='12px';
  }
});

<button id="button2">Click me</button>
<div id="demo2">Hello</div>

Answer 2

https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Attribute/onclick

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

.click触发点击，它不会监视他们

var clicks = 0;
document.getElementById('button2').onclick = function(){
  clicks++;
  console.log(clicks)
  if(clicks%2===0){
    document.getElementById('demo2').style.fontSize='22px';
  } else{
    document.getElementById('demo2').style.fontSize='12px';
  }
};

<div id="button2">button2</div>

<div id="demo2">demo2</div>

这是您应该执行的操作，尽管只需切换一个类即可查看删除了多少代码，并且它执行的操作完全相同：)

const button = document.querySelector('.button2');
const demo = document.querySelector('.demo2');

button.addEventListener('click', () => demo.classList.toggle('large'));

.demo2 {
  font-size: 12px;
}

.large {
  font-size: 22px;
}

<div class="button2">button2</div>

<div class="demo2">demo2</div>

基本的Java单击功能未加载

2 个答案: