javascript - 在 HTML 中的元素声明之后使用 element.focus() 会有害吗?

标签 javascript focus

我想制作一个表单,我想在其中自动将焦点放在一个字段上。在过去,我学会了总是等待执行任何 DOM 操作,直到 window.onload 被触发,因为 DOM 可能还没有准备好。自从 JQuery 以来,DOMContentReady 事件就变得很有名了,它(在兼容的浏览器中)比 window.onload 更早触发。

这仍然会在显示字段和获得焦点之间产生延迟(通过在 window.onload 中使用 document.getElementById("inputfield").focus() 或在触发 DOMContentReady 之后)。为了尽量减少这种延迟,有些人建议在页面中的元素之后直接使用 focus(),例如:

<form name="f">
  <input id="q" autofocus>
  <script>
    if (!("autofocus" in document.createElement("input"))) {
      document.getElementById("q").focus();
    }
  </script>
  <input type="submit" value="Go">
</form>

(示例来自 Dive Into HTML5)

此外,Google Closure 团队建议这种做法:“the preferred way is to use inline scripts as soon as possible ”,例如 another answer on SO州。

我不想争论这是否是不好的做法(总的来说,我同意内容和行为应该分开的观点,最好在单独的文件中)。我的问题是:这会有害吗?例如,在某些浏览器中导致错误消息,因为该字段可能仍未正确呈现(并且不要忘记移动浏览器)。任何建议表示赞赏。

最佳答案

不,它没有害处,它是(主观)最好的方法。

它最好的原因:

  • 代码尽快成功执行(而不是等待整个 DOM,它会等到到达某个元素)
  • 不依赖 DOM 事件(尚未标准化)

糟糕的原因:

  • 缺乏行为分离
  • 难以维护,因为代码会散落在各处
  • 由于多个 <script> 的存在,整体页面大小增加标签

关于javascript - 在 HTML 中的元素声明之后使用 element.focus() 会有害吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2246316/

相关文章:

visual-studio - Visual Studio : How to stop breakpoint hit from stealing focus?

c# - Google PDF 查看器中的水平滚动条

javascript - jest 带着 Promise 跳出函数

javascript - 如何在 html 页面上点击提交下载文件?

javascript - 如何在 Firefox 中自动聚焦 RTE 编辑器?

java - 黑莓:如何正确处理自定义字段中的焦点遍历?

javascript - 如果有任何输入获得焦点,则不执行函数

javascript - jQuery/CSS 添加淡入淡出效果

javascript - window.onload 与 <body onload =""/>

qt - QML TextField 设置焦点突出显示颜色