Blogger TIPS: Blogger×JavaScript：XMLエラーを防ぐ予備知識まとめ

BloggerはテンプレートがXML形式のため、普通にJavaScriptを書くだけでは文字列がエスケープされずにエラーになってしまうことがあります。

これを回避するために、以下のいずれかの方法で対処します。

1. CDATAを使う

XMLでは <script> 内の < や & などが特殊文字として解釈され、エラーになります。これを回避する方法が CDATA で囲むことです。


<script> /*<![CDATA[*/ // ここにJavaScriptを書く alert("Hello,Blogger!"); /*]]>*/ </script>

/*<![CDATA[*/ と /*]]>*/ で囲むことで、XMLの規則を尊重しつつ安全にJavaScriptを実行できます。初心者でもこれだけで多くのエラーを回避可能です。

XMLでは < → <、> → >、& → & のように特殊文字を置き換える必要があります。長いスクリプトでは手間が増えますし、後々コードを見返すときに見づらい問題があります。基本的には CDATA で囲む方法のほうが簡単です。

Bloggerの「レイアウト」→「ガジェットを追加」→「HTML/JavaScript」にスクリプトを貼る方法です。ガジェットに貼る場合にはJavaScriptをそのまま貼り付けても問題ありません。

<body> の終了タグ </body> の直前に置くと表示速度が速くなります。ページの途中に置くと、JavaScriptの処理が終わるまで表示が中断される場合があります。


<script> document.addEventListener('DOMContentLoaded', function(){ // 処理内容 }); </script>

まつさん
最初の頃はこのルールを理解してなくてエラーばっかりだしてました。