【javascript】appendChildの動作について

埋め込みスクリプトを の形で書きページに描写したいです。

セクションの「page.liquid」を複製し、endstyle と schemaの間のhtml部分を以下のようにスクリプト要素を作成し、appendChildで追加する形に書き換えました。

コンソールログでappendChildの直前まですべてうまくいっていることを確認できているのですが、おそらくappendchildだけ正常動作できていないのか、埋め込みスクリプトが表示されません。

srcに追加するリクエストパラメータを変数ではなく固定値にし、scriptタグをそのまま書き込むと正常表示されることを確認しています。

{%- endstyle -%}

  

    ## 
    
    
      
    

  

{% schema %}

@Anonymous_137eeb8730065ff8b1765f1b6ac7d8c3

掲載いただいているコードを試してみました。

‘外部アドレス’ が誤ってさえいなければ、うまく動作するように見受けられました。

Console.logをお使いになっているということは、Developer Toolsのコンソールをご覧になっていると思うのですが、コンソールに他にはエラーは表示されていないでしょうか?

(キュー田辺)

1 Like

ご回答ありがとうございます。

コンソールを確認すると以下のようなエラーを見つけました。

「It isn’t possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.」

エラー文で検索してみると、非同期で読み込まれる外部スクリプトからは、document.write()を実行できない。とのことでした。

この問題はiframeまたreactを利用することで解決できるようです。

ただ質問後、要件が変わり、問題の解決は不要になりました。

必要要件が終わりましたら、時間を見て再度検討しようと考えています。

参考:https://teratail.com/questions/19331

https://qiita.com/kazu_death/items/c3a2397349cf63a8ea68

1 Like