DOM 本体に CSS クラスを追加する安全かつ最速の方法 質問する

DOM 本体に CSS クラスを追加する安全かつ最速の方法 質問する

DOM の body 要素にクラスを追加したいと考えています。非常にシンプルで、body 要素自体の読み込みが速い (少なくとも、DOM に埋め込まれた要素よりも速く読み込まれると思います) のに、このような単純なタスクを実行するために jQuery Ready イベントを待つ必要があるのでしょうか。スタイルを body に追加するときに「ちらつき」効果が発生しないようにしたいと考えています。このクラスにアタッチされたさまざまな CSS スタイルは、追加時に有効になるためです。

次のようなことができます:

  jQuery(window.document).ready(function () {
    jQuery("body").addClass("home");
  });

しかし、もっと速くて安全な方法はあるのでしょうか?jQueryでもネイティブJavaScriptでも構いません

ベストアンサー1

document.body.className += ' home';

パフォーマンス比較:classNameclassListaddClass:

アップデート(PSLのコメントに基づく)

または新しいものdocument.body.classList.add("home");

必ず の下でこれを実行してください。スクリプト<body>から適用した場合は機能しません。<head>

おすすめ記事