序文: 場合によっては、ページのフォーカスがどの要素にあるかを取得する必要があります。フォーカスは、ユーザーがページを操作しているかどうか、およびその他の情報を判断するために使用できます。以前は自分で記録する必要があったため、便利ではありませんでした。HTML5 1. デフォルトの焦点はボディにありますページが読み込まれると、document.activeElement が body に配置されます。 console.log(ドキュメント.activeElement); // コンソール出力: //体 2. テキストボックスのフォーカスを手動で取得するフォーカスを取得する最も一般的な方法は、フォーム要素を使用することです。ここでは、テキスト ボックスを例に挙げます。 <input type="text" id="名前" /> テキスト ボックスにカーソルを置くと、コンソールに ドキュメント.アクティブ要素: 上でフォーカスされるのはテキスト ボックスです。 3. 集中することで集中力を高めるテキスト ボックスに手動で配置してテキスト ボックスにフォーカスを当てるだけでなく、 <input type="text" id="名前" /> <script type="text/javascript"> // テキスト ボックスの角度を取得します。 document.querySelector("#name").focus(); console.log(ドキュメント.activeElement); // Firefox ブラウザのコンソールに次のように表示されます: // <input id="名前" type="テキスト"> </スクリプト> 4. タブ切り替えフォーカスウェブページ上のタブからフォーカスを切り替えることができます。別のボタンを試してみましょう。 <input type="text" id="名前" /> <button>クリックしてください</button> 効果を確認しやすくするために、5 秒後に document.activeElement を印刷するタイマーを設定します。 タイムアウトを設定する(() => { console.log(ドキュメント.activeElement); // Firefox ブラウザのコンソールに次のように表示されます: // <ボタン> }, 5000); ページにアクセスし、タブでボタンに切り替えて、コンソール出力を表示します。 タブ切り替えフォーカス: 5. document.hasFocus()はフォーカスを取得するかどうかを決定する同様にタイマーを設定して表示します: タイムアウトを設定する(() => { console.log(document.hasFocus()); }, 5000);
以下もご興味があるかもしれません:
|
<<: テーブルの幅を固定して、テキストによって幅が変わらないように設定
今日、CSDN で HTML テキスト エスケープのちょっとしたトリックを見ましたが、とても簡単です...
序文この友人がどれくらいDockerを使っていなかったのかは分かりませんが、突然Dockerコマンド...
目次序文ホットチェンジとはCocos Hot アップデートの概要マニフェストプロジェクトリソースとゲ...
目次序文1. マルチレベルのデータとイベントの配信には$attrsと$listenersを使用する2...
Java環境変数を設定するここで、環境変数は etc/profile に設定され、つまり、すべてのユ...
1. 前提条件1. プロジェクトが展開されました2. Dockerはすでにインストールされている2...
この記事では、例を使用して MySQL の重複インデックスと冗長インデックスについて説明します。ご参...
jQuery の登場により、DOM の操作効率が大幅に向上し、開発がより高いレベルに引き上げられまし...
HTML と CSS を含む JD.com のホームページの静的ページ効果を 3 日間で完成させます...
毎日サービスをチェックしているときに、portainer からコンテナ ログを確認しようとしたところ...
ウェブサイトを見るというのは、実は美しい女性を評価するようなものです。見た目を見るとき、私たちは見た...
起源最近、私は要件 A に取り組んでいます。そこには、次のように記述される小さな機能ポイントがありま...
原則的にはwindow.print()メソッドを呼び出すことですが、このメソッドは現在のページ全体を...
この記事では、CSS を理解し始めたばかりの人を対象に、主に HTML で clearfix と c...
楽観的ロック楽観的ロックは、主にデータ バージョン記録メカニズムに基づいて実装され、通常はデータベー...