jquery - addClass がある要素では機能するのに、別の要素では機能しないのはなぜですか?

Question

クラス「open」は要素に追加されますが、ul要素には追加されませんdropdown#register。

<ul class="nav"></ul>
<script> $("#register_dropdown").addClass("open"); </script>
<script> $("ul").addClass("open"); </script>
<span class="dropdown" id="register_dropdown"></span>

Answer 1

$("#register_dropdown")register_dropdownその行を実行すると、DOM に存在しない空の jQuery オブジェクトが返されます。

私は HAML の経験がありませんが、スクリプトをDOM 対応ハンドラー内にラップするのがよい方法です。

%script $(function(){ $("#register_dropdown").addClass("open"); });

プレーン マークアップでは、次のようにレンダリングする必要があります。

<script> $(function(){ $("#register_dropdown").addClass("open"); }); </script>

必要に応じて、より詳細な方法を使用することもできます (上記と同じ結果)。

$(document).ready(function() {
    //DOM is ready, put your code here
    $("#register_dropdown").addClass("open");
});

これにより、DOM が完全に読み込まれるまでコードが実行されなくなります。要素が DOM に追加された後でその行を移動することもできますが、DOM の準備が整った後で DOM を操作することをお勧めします。

参照