Schnelleinstieg a-Tags und ECMAScript

Es werden die folgenden a-Tags betrachtet.

 <a href="interne_URL" target="_self"  class="intern"> teste </a>
 <a href="externe_URL" target="_blank" class="extern"> teste </a>

 <a onclick="alert('test');" href="javascript:void(0);"> teste </a>
 <a onclick="myfunc();return false;" href="#mein_href_text"> teste </a>
 <a onclick="return !!confirm('...?');" href="javascript:alert('test');"> teste</a>
Teste a-Tag-Aufruf (href) eines Weblink

Die Ziel-URL my.htm sei im gleichen Verzeichnis. Die Ziel-URL soll das aktuelle Browser-Fenster ersetzen:

<a href="strings-dias.htm"
   target="_self"
   class="intern"> teste </a> 

teste

Die Ziel-URL "../schrift/emoticons.htm" ist in einem anderen Unterverzeichnis. Ziel-URL soll im neuen Browser angezeigt werden:

<a href="../schrift/emoticons.htm"
   target="_blank"
   class="extern"> teste </a> 

teste CSS-Style für class="extern" ist .extern:after { content:"➹"; }

Teste a-Tag-Aufruf (onclick) mit ECMAScript

Aufruf der eingebauten alert()-Popup-Funktion mit einem Array

<a onclick="var arr=[5, ,'7',8];alert('arr='+arr+'\narr[1]='+arr[1]);"
   href="javascript:void(0);"
   class="alert"> teste </a>

teste


Aufruf der Funktion myfunc((4711.321).toFixed(1),'mystring'.replace(/[s-z]/gi,'')). Verwendet wird:

Code Snippet: myfunc(x,y)
  1. <script>
  2. function myfunc(x, s) { var str = "";
  3.   str += "myfunc(x,s)-Aufruf liefert:\n";
  4.   str += "x="+x+" (typeof x="+typeof x+")\n";
  5.   str += "s="+s+" (typeof s="+typeof s+")"; window.alert(str);
  6. }
  7. </script>
<a onclick="myfunc((4711.321).toFixed(1),'mystring'.replace(/[s-z]/gi,''));"
   href="javascript:void(0);"
   class="alert"> teste </a> 

teste

Funktionsaufruf mit onclick="..." aber unter href="#mein_hinweis" soll ein erklärender Hinweis fuer die Statuszeile stehen. Dieser dummy-Text darf nicht ausgeführt werden. Wichtig! Damit nach der onclick-Funktionsausführung kein href ausgeführt wird, muß onclick="..." mit "return false;" beendet werden. Ohne "return false;" wird href="javascript:void(0);" benötigt.

<a onclick="myfunc(4711,'mystring');return false;"
   href="#mein_href_text" class="alert"> teste </a> 

teste

Teste bedingten Funktionsaufruf von href, falls onclick return true zurück gibt ...
<a onclick="return !!confirm('Soll\n\thref=...\n\t\taufgerufen\n\t\t\twerden?');"
   href="javascript:myfunc((4711.321).toFixed(1),'mystring'.toUpperCase());"
   class="alert"> teste </a>

teste confirm-Box mit myfunc()

Teste event.type und this.tagName mit dem folgenden Code-Schnipsel
<a href="javascript:void(null)" 
   onclick="alert('event.type='+event.type+'\nthis.tagName='+this.tagName);return false;"> 
   teste event.type und this.tagName 
</a>

teste: event.type und this.tagName

Teste event- und this-Objekt mit dem handle_event(event,this)-Code-Schnipsel
function handle_event(ev, that) { ev = ev || window.event;
  var type = ev.type,  target = (ev.target || ev.srcElement),
  tag_name1 = target.tagName, tag_name2 = that.tagName;
  alert(type + ' .tagName mit event=' + tag_name1 + ' mit this=' + tag_name2);
//window.setTimeout(function () {alert(type+' '+target+' '+that.tagName);}, 20);
}

teste: handle_event(event,this)