Novas janelas em Javascript não-obstrusivo

A newsletter dessa semana do SitePoint mostrou uma forma bem interessante de abrir novas janelas com javascript não-obstrusivo e validando XHTML Strict (para quem não sabe, o atributo ‘target’ da tag ‘a’ não passa na validação).

<a href="http://example.com/" onclick="
    if (confirm('Open this link in a new window?')) {
      open('http://example.com/');
      return false;
    }
">external link</a>

Basicamente, emprega-se o uso de uma caixa de diálogo. Bem simples. Uma alternativa mais sofisticada é criar uma função e ativá-la através do uso de uma classe. Veja:

<a href="http://example.com/" class="ext">external link</a>
<script type="text/javascript">
  var links = document.getElementsByTagName("a");
  for (var i = 0; i < links.length; i++) {
    var link = links&#91;i&#93;;
    if (link.className == "ext") {
      link.onclick = clickHandler;
    }
  }

  function clickHandler() {
    if (confirm("Open this link in a new window?")) {
      open(this.href);
      return false;
    }
  }
</script>

 

Leonardo

Registros de Leonardo Faria sobre desenvolvimento web

 
  • Parabéns,

    Ótimo tutorial, me ajudou muito aqui.

    abraço

  • Muito interessante mas, gostaria de saber como fica a questao da indexação?
    O google, por exemplo, consegue indexar esta página normalmente pelas tags A ?
    Ja uso uma tecnica parecida ha algum tempo, mas tenho sempre esta preocupação.

    Abração.

  • felipe, a indexação vai se basear no conteúdo do ‘href’. Logo, não terermos problema