Dart: добавление дочерних элементов в DivElement программным способом

Скажем, я хочу программно добавить ButtonElement к DivElement, так что результирующий HTML будет:

<div class="blah">
    <input type="button" name="whatever" value="Push Me!" />
</div>

В Dart я вижу несколько методов в классе DivElement, и я не уверен, какой из них подходит для какого контекста:

ButtonElement button = constructButtonElement();
DivElement div = constructDiv();

div.add(button);
div.nodes.add(button);
div.children.add(button);
// ???

То же самое и с любыми другими типами контейнеров: BodyElement, SpanElement и т. Д. Как правильно динамически добавлять элементы DOM в родительские контейнеры?


person IAmYourFaja    schedule 29.12.2013    source источник


Ответы (1)


Я предпочитаю работать с элементами DOM, используя общие методы и операции Dart. Итак, чтобы добавить кнопку в div, который затем прикрепляется к телу, я бы сделал следующее:

import 'dart:html';

void main() {
  var div = new DivElement();
  var button = new ButtonElement()
    ..id = 'foo'
    ..text = 'Foo';
  div.children.add(button);
  document.body.children.add(div);
}

Это создает ButtonElement с id и text, добавляет его к children DivElement и добавляет DivElement в тело документа.

person Shailen Tuli    schedule 29.12.2013