html - 如何在 Dart 中创建 HTML 链接？

Question

我想用 Dart 创建一个 HTML 链接。

我会在 HTML 中的什么地方写:

You can click <a href="url_1">here</a> and <a href="url_2">there</a>.

我不知道如何在 Dart 中执行此操作。我试过类似的东西:

LinkElement link1;
link1.href = "url1";

我不知道如何将 link1 对象插入到静态句子中，如上面的 HTML 示例。

Answer 1

有很多方法可以做到；这里有两个:

import 'dart:html';

void main() {
  // Method one: build everything from scratch
  var p = new ParagraphElement();
  var link1 = new AnchorElement()
    ..href = 'url_1'
    ..text = 'here';
  var link2 = new AnchorElement()
    ..href = 'url_2'
    ..text = 'there';

  p ..appendText('You can click ')
    ..append(link1)
    ..appendText(' and ')
    ..append(link2)
    ..appendText('.');

  document.body.children.add(p);

  // Method two: just set `innerHtml` with an HTML fragment
  var p2 = new ParagraphElement()
    ..innerHtml = 'You can click <a href="url_1">here</a> '
                  'and <a href="url_2">there</a>.';

  document.body.children.add(p2);
}

你可以在这两个极端之间做一些事情，或者你可以像你习惯的那样把它写在一个 HTML 文件中，给你需要的部分适当的 ids 或 classes 以便您可以从 Dart 访问它们。很难从你的问题中确切知道你的需求是什么，但这些选项应该涵盖你认为适合你的情况的任何内容。