1

3 日前に最初の helloworld に気付きましたが、今はさらに先に進みたいと思っています。

関数を呼び出して、結果を html に入れようとしました。

My HelloWorld.dart

import 'dart:html';

main() {
  var s = '';
  for (var i = 0; i < 10; i++) {
    s = '$s$i ';
  }

  HTMLElement element = document.getElementById('text');
  element.innerHTML = 'test';
  //element.innerHTML = s;
  print(s);
}

私の印刷（S）作業、それは私のダーツエディタの出力で私を印刷します：0 1 2 3 4 5 6 7 8 9

しかし今、私は自分のhtmlに結果を入れたいと思っています。

だから、これは私の HelloWorld.html です:

    <!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>HelloWorld</title>
    <link rel="stylesheet" href="HelloWorld.css">
  </head>
  <body>
    <h1>Exercice 01</h1>

    <p>Hello world from Dart!</p>

    <div id="container">
      <p id="text"></p>
    </div>

    <script type="application/dart" src="web/HelloWorld.dart"></script>
    <script src="https://dart.googlecode.com/svn/branches/bleeding_edge/dart/client/dart.js"></script>
  </body>
</html>

とてもシンプルですね。したがって、実際には、h1 と p を含むページが表示されます。しかし、ID「テキスト」に何も表示されません。変数をプッシュしようとしましたが、機能しないため、ご覧のとおり単純な文字列をプッシュしようとしました（投稿の最初のコードブロックに戻ります） 、動作しません。

.html と .dart の間の通信について何か誤解している可能性があります。誰か助けてもらえますか?

Ps: 出力にエラーはありません。

4

1 に答える 1

3

質問ありがとう！

まず、次のようquerySelector()に、document.getElementById の代わりに使用します。

import 'dart:html';

main() {
  var s = '';
  for (var i = 0; i < 10; i++) {
    s = '$s$i ';
  }

  var element = querySelector('#text');
  element.text = 'test';
  print(s);
}

querySelector() は、CSS セレクターを受け入れ、一致する最初の要素を返すことによって機能します。ID で要素を検索するには、#the-id構文を使用します (または、要素の ID の前に を付けます#)。

の代わりにセッターinnerHTMLを使用します。element.text

それが役立つことを願っています!

于 2012-10-26T01:12:26.717 に答える