javascript - Div コンテンツが Cookie 値を取得しない

Question

次のようなdivがあります。

<div class="bubbly">
 </div>
 <script>
 $('.bubbly').innerHTML=getCookie('adjective');
 </script>

しかし、この div のコンテンツは表示されません。Cookie に警告すると、値が取得されます。しかし、div は Cookie の値を取得していません。このdivにCookieの内容を入れたいです。

Answer 1

jQuery のように見えるものとプレーンな JavaScript を混在させています。したがって、.html()メソッドを使用して要素のコンテンツを設定する必要があります。

$('.bubbly').html(getCookie('adjective'));

または、ネイティブの innerHTML プロパティを使用する場合は、jQuery オブジェクトから DOM 要素を取得する必要があります。

$('.bubbly')[0].innerHTML = getCookie('adjective');

Answer 2

試す

$('.bubbly').html(getCookie('adjective'));

getCookie 関数が適切に機能すると仮定します。innerHTML純粋な JavaScript のものです。

Answer 3

jquery オブジェクトでネイティブ DOM プロパティを使用する場合は、次のようにします。

$('.bubbly')[0].innerHTML=getCookie('adjective');

次のようにjqueryで同じことをすべて行うことができます：

$('.bubbly').html(getCookie('adjective'));

また、次のように、DOM 操作コードを DOM 準備完了イベントのハンドラーで囲むようにしてください。

<div class="bubbly">
 </div>
 <script type="text/javascript">
    $(document).ready(function() {
        $('.bubbly').html(getCookie('adjective'));
    });
</script>