Dart - ページの部品をかき集める(奇麗な選択肢ボタンの設計(inputタグではなくspanタグの利用))

Dart: Up and Running
(O'Reilly Media)
Kathy Walrath Seth Ladd (著)
[Kindle版]
このブログでの感想

開発環境

• OS X Mavericks - Apple (OS)
• Dart Editor (開発環境)
• Dartium | Dart/ Structured web apps (ブラウザ, Dart VM 用 (Chromium with the Dart VM))
• Safari (ブラウザ, JavaScript 用)
• Dart (プログラミング言語)

Head First JavaScript ―頭とからだで覚えるJavaScriptの基本( Michael Morrison (著), 豊福 剛 (翻訳)、オライリージャパン)の8章(ページの部品をかき集める)、自分で考えてみよう(p.367)をDartで考えてみる。

その他参考書籍

• What is Dart? [Kindle版] (O'Reilly Media) Kathy Walrath Seth Ladd (著) このブログでの感想

自分で考えてみよう(p.367)

コード

sample.dart

import 'dart:html';

void main() {
  decision1.onClick.listen((MouseEvent event) => scenetext.text = 'decision1');
  decision2.onClick.listen((MouseEvent event) => scenetext.text = 'decision2');
}
  

DivElement scenetext = querySelector('#scenetext');
SpanElement decision1 = querySelector('#decision1');
SpanElement decision2 = querySelector('#decision2');

sample.html

<div id="scenetext"></div><br />
<span id="decision1">ゲームスタート</span>
<span id="decision2"></span>

scene

(1)ゲームスタート (2)