href attribute for links in Dart: "#" or "javascript: void(0);"?

Question

There is a similar popular question regarding whether to use # or javascript:void(0) in the href attribute.

What's the preferred way to do this in the Dart community? If I use the hash, the browser scrolls to the top, but with javascript:void(0) it looks ugly not just because it is but also because we are doing Dart and not JavaScript.

score 4 · Accepted Answer · edited Dec 25 '13 at 13:02

There is this a horrible myth on the web that we should use # or javascript:void(0). Please, do not do this. The only case when you are allowed to use # is when you want to scroll to different sections of the page.

If you don't want the link to have the default behavior of taking you somewhere, either don't use a link or take the entire href-attribute away:

test.html

<!DOCTYPE html>
<html>
  <body>
    <a id="foo">Do something</a>

    <script type="application/dart" src="test.dart"></script>
    <script src="https://dart.googlecode.com/svn/branches/bleeding_edge/dart/client/dart.js"></script>
  </body>
</html>

Next we have to override some default styles to make sure we get the hand-cursor and underlining, because browsers tend to remove those when you don't have a href-attribute:

styles.css

a {
    cursor: pointer;
    text-decoration: underline;
}

a:hover {
    text-decoration: none;
}

Lastly our Dart code that does whatever you want it to do:

test.dart

import 'dart:html';

void main() {
  AnchorElement a = query('#foo');
  a.on.click.add((e) {
    print('Clicked! Do something.');
  });
}

href attribute for links in Dart: "#" or "javascript: void(0);"?

1 Answers1