能否用JavaScript模拟网页中按Tab键跳转时的元素高亮效果？

直接用JavaScript就能实现元素的高亮聚焦，核心是利用浏览器的原生聚焦机制，以下是几种实用方案：

• 原生聚焦实现默认高亮
  调用元素的focus()方法，浏览器会自动给元素加上默认的高亮样式（通常是蓝色外边框），完全符合你要的“选中/高亮”效果：

  const target = document.getElementById('answer-sort-dropdown-select-menu');
  target.focus();
  

• 自定义高亮样式
  如果默认样式不够显眼，可以结合CSS自定义高亮效果：
  先定义一个高亮类的样式：

  .highlighted {
    outline: 3px solid #ff9800; /* 橙色高亮边框 */
    background-color: rgba(255, 152, 0, 0.1); /* 配套浅橙色背景 */
  }
  

  再通过JS给目标元素添加类并聚焦：

  const target = document.getElementById('answer-sort-dropdown-select-menu');
  target.classList.add('highlighted');
  target.focus();
  

• 处理不可聚焦元素
  像<div>这类默认不可聚焦的元素，需要先设置tabindex="-1"（设为-1可通过JS聚焦，但不会加入Tab跳转顺序），再调用focus()：

  const target = document.getElementById('answer-sort-dropdown-select-menu');
  target.setAttribute('tabindex', '-1');
  target.focus();
  

内容的提问来源于stack exchange，提问作者d-b