jQuery使用しています。
var tag = '<div id="aaaa">~~~~~</div>';
$("body").prepend(tag);
alert($("#aaaa").height());
でブラウザ上には表示出るのですが、直後に表示したボックスの高さを取得しようとすると、1回めのキャッシュがない状態ではおかしなことになります。キャッシュがある状態では正しく出ます。
tagの中には画像とかを高さ指定せずに入れてるから、描画前には取得できないからだと思いますが、描画が完了した段階で高さを取得するにはどうしたらよいでしょうか?
No.2ベストアンサー
- 回答日時:
通常のテキストなどだけから構成されているHTML要素なら、ご提示の方法で取得できると思いますが…?
もしかして、div要素の中にブラウザが取得するのに時間がかかる要素( 例えば<img>など )が包含されていませんか?
そのような場合は、DOM要素自体は追加されていても、要素の実際のサイズが不明な状態(ブラウザが画像データ等を取得するまで)の間は、当然ながら最終表示形での値は返ってこないと考えられます。
画像などのonloadを待って値を取得するか、プレロードするようにしておくかなどで対処可能と思いますが、事前に追加するHTMLの内容がわかっている必要がありますね。
かなりアバウトでもよいのなら、setTimeoutで適当な時間経過後に処理をするとかでもいけるかも知れませんが、これはほとんど根拠のない方法とも言えるかも。
プレロードしておく場合でも、ご提示の処理までに充分な時間がとれない可能性(ロード完了前に処理が発生してしまう)があるなら、結局のところ、画像のonloadを確認するという処理が必要になるでしょう。
ありがとうございます。
質問時、頭が混乱していましたが、要約すると
画像のプレロード開始のタイミングを知りたかったのでした。
今は以下のように理解しています。
var imgObj = $("<img />");
imgObj.attr({ "src":"./1.bmp"}); //この時点でhttpdリクエスト開始されている。
var imgObj2 = $("<img />");
imgObj2.attr({ "src":"./2.bmp"}); //1.bmpが読み込み完了してなくとも並行して2.bmpに対してのhttpdリクエスト開始
imgObj.load(function(){
imgObj2.load(function(){
//1.bmp 2.bmpとも読み込み完了した状態
});
});
並行して同時読み込みされるのかが心配でしたが、されるようでしたので安心しました。
No.1
- 回答日時:
$(document).ready()の中に入れればいいのでは?
「window.onload=」見たいなものです。
ちなみに、jQueryを使うなら
>var tag = '<div id="aaaa">~~~~~</div>';
なんてのはやめましょう。
「jQuery DOM要素 生成」で検索。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- JavaScript javascriptのちょっとした動作不良(原因は突き止めたのですが) 1 2023/06/15 19:58
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
VBAでActiveDirectoryのユーザ...
-
VB.NETで DataRow()を利用して...
-
ListView 項目の選択/選択解除...
-
VBA:小数点以下の数字を取得で...
-
データ数をカウントしたいのですが
-
利用者側のMACアドレスを取得し...
-
count(*)で取得した値をJAVAの...
-
getParameter と getAttribut...
-
「Excel VBA」 Webクエリ マク...
-
VBScriptで数値にコンマを付け...
-
VBA リストボックス内の値を複...
-
Flexgridで選択行の列の値を取...
-
リストボックスをチェックボッ...
-
C言語におけるコンピュータ名・...
-
Yahoo! JAPANのID取得について
-
JAVA 入れ子MAPの取得時の書き...
-
like演算子内に変数って使えな...
-
VB .netにて現在時刻+1時間後...
-
指定のURLのタイトルを取得...
-
デスクトップフォルダのパスを得る
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
VB.NETで DataRow()を利用して...
-
count(*)で取得した値をJAVAの...
-
データ数をカウントしたいのですが
-
VBA:小数点以下の数字を取得で...
-
VBAでActiveDirectoryのユーザ...
-
ListView 項目の選択/選択解除...
-
Flexgridで選択行の列の値を取...
-
getParameter と getAttribut...
-
like演算子内に変数って使えな...
-
ListViewで複数選択された項目...
-
JavaScriptでWindowsログオンID...
-
時間を分に変換するプログラム
-
エクセルVBAで複数選択できるよ...
-
Spreadの選択行の取得について
-
JavaScriptにおいてコンピュー...
-
コンボボックス表示文字列を取...
-
VBA リストボックス内の値を複...
-
利用者側のMACアドレスを取得し...
-
「Excel VBA」 Webクエリ マク...
-
Yahoo! JAPANのID取得について
おすすめ情報