2

Dart では、div 要素に HTML を動的に追加しようとしています。

注: mainContainer 要素は、HTML コードの単なる div です

import 'dart:html';

main()
{ 
  loadHTML("web/html/test.html");
}

void loadHTML(String fileName) 
{
  DivElement div = query("#mainContainer");
  div.children.clear();

  HttpRequest.getString(fileName).then((resp) {
    div.appendHtml(resp);
  });
}

これは、テスト目的のためだけの test.html です。

<h1 id="test">test</h1>

問題は、 #testをクエリしたいときに何も見つからないことです

...
main()
{ 
  loadHTML("web/html/test.html");

  Element elem = query("#test");
  if (elem == null)
  {
    print("element is null");
  }
}
...

HTML がまだドキュメントに読み込まれていないためですか? ここで何が起こっているのかわかりません。実際の HTML はブラウザーに表示されますが、 testは見つかりません。

Dart SDK バージョン 0.5.5.0_r22416 の使用

4

1 に答える 1

5

コードが現在編成されている方法で#testは、HTML フラグメントが に追加される前にクエリを実行していdivます。コールバックで必要なことを行うと、次のよう#testに動作するはずです。

HttpRequest.getString(fileName).then((resp) {
  div.appendHtml(resp);
  Element elem = query("#test");
  if (elem == null)
    print("element is null");
});

何が起こっているのかはっきりしない場合、HttpRequest は非同期です。これは当然のことですが (ネットワークで待機している間はブロックしたくありません)、コードでこれを考慮する必要があります。が返されたからといって、フェッチされた HTML がページに追加されたとは期待できません loadHTML()。

于 2013-05-08T01:57:40.827 に答える