如何用Dart設置元素的文本？

3天前我意識到我的第一個helloworld，現在我又去了。如何用Dart設置元素的文本？

我嘗試調用一個函數，並把結果放到我的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「文本」，我嘗試推我的變種，不起作用，所以我嘗試推一個簡單的字符串，你可以看到（返回在我的職位的第一個代碼塊），並且不起作用。

我可能錯過了有關.html和.dart之間通信的東西，請問有人能幫我嗎？

Ps：我沒有在我的輸出中的任何錯誤。

來源

2012-10-26 Peter

感謝您的問題！

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

希望有幫助！

來源

2012-10-26 01:12:26

請注意更新的語法;現在，您將希望使用'querySelector'通過ID獲取元素，並使用'querySelectorAll'獲取元素的集合，例如通過它們的公共類名稱。 –

謝謝！我更新了這篇文章。 –

如何用Dart設置元素的文本？

回答

相關問題