如何使复选框不可见，同时保持“焦点”？

<label for="invisibleCheckbox">点击这里</label>
<input type="checkbox" id="invisibleCheckbox" style="visibility: hidden;">

#invisibleCheckbox {
  visibility: hidden;
}

document.getElementById('invisibleCheckbox').addEventListener('focus', function() {
  this.style.outline = 'none'; // 移除默认的焦点样式
});

document.getElementById('invisibleCheckbox').addEventListener('blur', function() {
  this.style.outline = ''; // 恢复默认的焦点样式
});