div要素の高さを取得したいなと思ったので、jqueryのheight()を使って取得しようとしたんですが、見事にnullが返ってきた。なんですと。
いろいろ調べて原因がはっきりしたんですが、dom要素が生成されていないのに高さを取得しようとしていたのでnullがreturnされたんです。
解決方法は以下の2種類
head内でheight()を宣言するときは、$(document).ready()内で宣言する
ほとんど、height()でnullがでてくるのはこれが原因。head内でready()外にheight()を宣言することで、dom要素が生成されていないのに高さを取得しようとしていた現象が起こりnullがでてくるということ。
$(document).ready()はcssやらHTMLやらがすべて読み込まれてから、このready()内記述を読み込みますよという処理を行います。
詳しいready()とか$(function(){});の説明は下記URLを参照してください。
body閉じタグ直前にjavascript関係は宣言する
この回避法も有効です。htmlに直接書き込む場合はbody閉じタグ直前に書き込むと回避できます。これはプログラムは上から下に読み込まれていきますので、hight()より先に記述してある取得したいdom要素はすでに生成されており、heightが取得可能となります。
と、言うわけで
作業中、頭の中で「???」となったんで調べてみました。
動作するはず!って思い込みで作業してたら気づきにくいミスだと思います。あなたはきちんと回避してくださいね。