Question

我在3天前实现了我的第一个helloworld，现在我再次前进了。

我尝试调用一个函数，并将结果放在我的html中。

我的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“文本”中的任何内容，我尝试推送我的var，不起作用，所以我尝试推送一个简单的字符串，你可以看到（返回我的帖子的第一个代码块），并且不起作用。

我可能很想念.html和.dart之间的沟通，有人可以帮我吗？

Ps：我的输出中没有任何错误。

Answer 1

感谢您的提问！

首先，使用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 setter。

希望有所帮助！

如何使用Dart设置元素的文本？

1 个答案: