ホームページ制作関連の技術ネタを備忘録的にまとめています

javascript、ajaxのデバッグですが、変数の値やajaxの戻り値などを見るのに

alert関数で変数などの中身を表示することは出来ますが、ajaxの戻り値が長い場合に

中身を見てみたいとなった時alert関数では全て表示されなかったり、

コピペできなかったりと不便です。

そんな時はconsole.log(hogehoge)とすると便利です。

今回、ajaxの戻り値がhtmlでかなり長文だったためalert関数では全て表示されず、コピーもできないので最初は画面で追ってみましたがどうにも不便なためコンソールに出力して確認することで作業の時短になりました。

レスポンシブデザインの際に、PC用とスマホ用で別のJSを使用する必要があったので、
その方法を記載しておきます。

<script type=”text/javascript”>
jQuery(document).ready(function($) {
if (window.matchMedia( ‘(min-width: 768px)’ ).matches) {
$.ajax({
url: ‘●●●●●_pc.js’,
dataType: ‘script’,
cache: false
});
} else {
$.ajax({
url: ‘●●●●●_sp.js’,
dataType: ‘script’,
cache: false
});
}
});
</script>

ブレイクポイントはCSSに合わせて適宜変更する必要があります。

また、Google Chromeではローカル環境では正しく動作しないため、サーバー上で確認する必要があります。