Chrome 92—devtools の新機能
Chrome は 6 週間ごとに新しいバージョンをリリースします。バージョン 92 は数日前にリリースされました。新機能のいくつかを見てみましょう!
CSS グリッド エディタ
グリッド レイアウトの要素は、スタイル内の属性を手動で変更できます。
css グリッド エディタ
display:grid の後ろのアイコンをクリックすると、グリッドのレイアウト属性の一部が表示されます。切り替え属性は要素に直接適用できます。
コンソールでのconstの2次宣言
コンソールでスクリプトを書いてconst変数を定義していたのですが、実行後に再度スクリプトを実行すると、 :
識別子はすでに宣言されています
デバッグ中にこれによって中断されることがよくあるため、実行する前にページを更新する必要があります。スクリプトを再度実行できます。これで、エラーなしで直接実行できるようになり、スニペットで実行する場合も同様に機能します。
要素の元の順序を表示
#要素が書き込まれる順序HTML で表示される場合があります 順序が一貫していません。Chrome では、表示と要素の順序の間にリンクが追加されました。アクセシビリティでソースの順序を表示にチェックを入れると、要素の元の順序が表示されます。シミュレーションの焦点
以前に同様の検索ボックスをデバッグしたとき、テキストを入力し、表示されたオプションから要素を検査するために検査を選択し、ドロップ一部の Web サイトのドロップダウン ボックスが消えると、要素も消えるため、あいまい一致によって生成されたドロップダウン ボックスをデバッグできなくなります。例: 入力キーワードWeb サイトの検索ボックスに一致する検索結果が表示され、右クリックしてそのいずれかを選択し、DOM 内のこの要素を表示します。