imforumman: JavaScript als Protokoll vs onClick

Wenn man so diverse Seiten betrachtet die JavaScript nutzen scheint es zwei Lager zu geben wenn es zur frage kommt wie man durch einen Click auf einen Anchor ein JavaScript Aufruf realisiert.

Die einen notieren
<a href="javascript:funktion()">...</a>
also nutzen sie JavaScript als Protokoll.

Die anderen notieren
<a href="#" onClick="funktion()">...</a>
gehen also ueber einen Eventhandler.

Ich persoenlich finde das Protokoll den saubereren Weg, in der Statuszeile sieht der Anwender was passieren wird und es gibt nicht dieses komischen Verweis auf einen leeren Anker. Doch unter den Mozilla Entwicklern gibt es Leute die das "Protokoll JavaScript" verfluchen, jetzt frage hier unter denen die sich auskennen, was ist der reinere/bessere/sauberere Weg?

Gruss!

  1. Hi,

    Wenn man so diverse Seiten betrachtet die JavaScript nutzen scheint es zwei Lager zu geben wenn es zur frage kommt wie man durch einen Click auf einen Anchor ein JavaScript Aufruf realisiert.

    drei. Die beiden von Dir genannten - und die Leute, die es richtig machen.

    <a href="javascript:funktion()">...</a>
    <a href="#" onClick="funktion()">...</a>

    Wenn es sich um etwas handelt, dass tatsächlich nur mit JavaScript geht, dann wird der Link (oder was immer) auch mit JavaScript ausgegeben; und es ist herzlich egal, welche Variante genutzt wird. Geht es jedoch darum, ein neues Fenster zu öffnen, irgendwohin weiterzuleiten, mehrere Frames zu ändern, kurz: eine neue Ressource anzufordern, dann wird diese zunächst einmal im href-Attribut referenziert. Im onClick-Handler kann dann _zusätzlich_ eine JavaScript-Funktion aufgerufen und ein unwahrer Wert zurückgegeben werden.

    Ich persoenlich finde das Protokoll den saubereren Weg,

    Wer etwas macht, für das keine HTML-Alternative existiert, der macht höchstwahrscheinlich etwas falsch. Der Weg ist also ziemlich sicher _nicht_ sauber. Genauso wie der mit href="#".

    Cheatah

    --
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi.

      Danke. Ich ergaenze:

      <a href="javascript:funktion()">...</a>
      <a href="#" onClick="funktion()">...</a>
      <a href="jsfrei.html" onClick="funktion();return false;">...</a>

      Wer etwas macht, für das keine HTML-Alternative existiert, der macht höchstwahrscheinlich etwas falsch.

      Ohoh. Ober-mega-super Purist! ;-) Im Prinzip stimme ich dir fast zu, aber alternative Style Sheets oder meine JS-Photogallerie sind nun mal JS Anwendungen und wer heute auf JavaScript verzichtet... naja, selber Schuld (es gibt "sichere" Browser, die auch noch Popups unterbinden usw, es gibt meines erachtens kein Gund JS voellig ab zu stellen.)

      1. hi,

        Im Prinzip stimme ich dir fast zu, aber alternative Style Sheets oder meine JS-Photogallerie sind nun mal JS Anwendungen

        unsinn.
        ein stylesheet wird idR. über <link> eingebunden - und dem neu laden der seite, so das eine serverseitige logik gelegenheit hat hier die angeforderte ressource auszutauschen, steht nichts entgegen.
        und eine photo-galerie (btw: hat deine mit den zwei 'l' was mit galle zu tun?) braucht auch kein JS - es sei denn, _du_ legst wert auf popup-fenster in der "richtigen" grösse. aber selbst dann kann das, worauf deine user wert legen, immer noch was anderes sein ...

        gruss,
        wahsaga

      2. Hi,

        Ohoh. Ober-mega-super Purist! ;-)

        nö, nur erfahren. Purismus würde den Begriff "höchstwahrscheinlich" verbieten.

        [...] wer heute auf JavaScript verzichtet... naja, selber Schuld

        Wie kommst Du darauf, jeder habe uneingeschränkten Einfluss auf die Konfiguration seines Systems?

        (es gibt "sichere" Browser, die auch noch Popups unterbinden usw,

        Wie kommst Du darauf, jeder könne seinen Browser frei wählen? Wie kommst Du eigentlich darauf, es ginge nur um Browser?

        es gibt meines erachtens kein Gund JS voellig ab zu stellen.)

        Dann recherchiere bitte im Archiv nach möglichen Gründen. Dutzende wurden bereits genannt.

        Cheatah

        --
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
      3. <a href="javascript:funktion()">...</a>
        <a href="#" onClick="funktion()">...</a>
        <a href="jsfrei.html" onClick="funktion();return false;">...</a>

        Ich vermute mal du meinst mit funktion ein popup o.ä. das läßt sich leicht auch ohne JS funktionsfähig machen:
        <a href="bild.jpg" onClick="zeigeBild(this.href);return false;">...</a>

        Ohoh. Ober-mega-super Purist! ;-) Im Prinzip stimme ich dir fast zu, aber alternative Style Sheets oder meine JS-Photogallerie sind nun mal JS Anwendungen und wer heute auf JavaScript verzichtet... naja, selber Schuld (es gibt "sichere" Browser, die auch noch Popups unterbinden usw, es gibt meines erachtens kein Gund JS voellig ab zu stellen.)

        Naja, ich würde mit dem IE, gerade unbedarftern Usern, jeden empfehlen activeScripting nur bei vetrauenswürdigen Seiten zu zulassen. Der hat nach wie vor einige erhebliche Sicherheitslücken.

        Für JS bei Anwendungen spricht aber nichts, da man da ja durchaus von einem Mehrwert für den Benutzer ausgehen sollte.

        Struppi.

        1. Hallo Struppi,

          Ich vermute mal du meinst mit funktion ein popup o.ä. das läßt sich leicht auch ohne JS funktionsfähig machen:
          <a href="bild.jpg" onClick="zeigeBild(this.href);return false;">...</a>

          Kleine Korrektur: Funktionsfaehig mit Einschraenkungen ;-)

          IMO ist es vordringliche Aufgabe eines Webbrowsers, "seitenbeschreibende" Dateien zu interpretieren.

          In diesen koennen z.B. auch Grafikdateien referenziert werden - zur Darstellung in einem entsprechenden Element (z.B. <img>), was manche Webbrowser auch koennen/duerfen.

          Als unsauber/unrichtig empfinde ich es, (alle) Webbrowser als "eierlegende Wollmilchsaeue" zu betrachten, denen man verschiedenste Dateiformate "zuwerfen" kann, darauf vertrauend, dass sie schon etwas Gescheites damit anstellen.

          (BTW: mir ist absolut bewusst, dass gerade dies haeufig geschieht - darum gibt es ja z.B. so viele MS-Office-Dateien im WWW ;-))

          Als sauber/richtig empfinde ich es, in obigem Fall z.B. eine HTML-Datei zu referenzieren, in der wiederum fuer ein geeignetes Element (wohl <img>) die Grafikdatei referenziert ist - selbstredend unter Verwendung des "alt"-Attributes mit einem sinnvollen Inhalt ;-)

          SCNR

          gruesse
          rainer groth

          --
          ss:| zu:} ls:& fo:) de:] va:| ch:] n4: rl:? br:$ js:| ie:| fl:( mo:?
          (--> einer der letzten bauhaeusler <--)
  2. Hallo imforumman,

    Die einen notieren
    <a href="javascript:funktion()">...</a>
    also nutzen sie JavaScript als Protokoll.

    JavaScript ist IMHO kein Protokoll, sondern eine Programmiersprache ;-)

    Deshalb meine auch ich, dass obiges Beispiel unsauber/unrichtig ist, da die Moeglichkeit der Hyperreferenzierung fuer etwas voellig anderes missbraucht wird.

    Unnoetig zudem, gibt es fuer Skript-Aufrufe doch die Attribute-Teilmenge "Event-Handler".

    gruesse
    rainer groth

    --
    ss:| zu:} ls:& fo:) de:] va:| ch:] n4: rl:? br:$ js:| ie:| fl:( mo:?
    (--> einer der letzten bauhaeusler <--)
  3. Hallo,

    Die einen notieren
    <a href="javascript:funktion()">...</a>
    also nutzen sie JavaScript als Protokoll.

    dieser Weg verursacht sehr oft den unschönen Sanduhr-Effekt und das ist mehr als störend

    Die anderen notieren
    <a href="#" onClick="funktion()">...</a>
    gehen also ueber einen Eventhandler.

    diese Notation ist ein veraltetes Überbleibsel. Es war notwendig, um beispielsweise Browser wie den Netscape 4 zu unterstützen. Da heute alle modernen Browser Click-Eventhandler in den meisten Elementen unterstützen, ist dieses Verfahren überflüssig geworden.

    solche Aufgabenstellungen können beispielsweise so gelöst werden:

    <span onclick="funktion()" class="linkclass">Beschreibungstext</span>

    .linkclass {cursor:pointer;}

    Browser die onclick im Span-Tag verstehen, verstehen im Regelfall auch cursor:pointer
    Das ist übrigens eine sehr bequeme Methode, veraltete Browser auszuschließen bzw. man kann diese Klassen-Eigenschaft auch mit JS setzen.

    Ich persoenlich finde das Protokoll den saubereren Weg, in der Statuszeile sieht der Anwender was passieren wird und es gibt nicht dieses komischen Verweis auf einen leeren Anker. Doch unter den Mozilla Entwicklern gibt es Leute die das "Protokoll JavaScript" verfluchen, jetzt frage hier unter denen die sich auskennen, was ist der reinere/bessere/sauberere Weg?

    :-) je nach Aufgabenstellung

    Das Pseudoprotokoll JavaScript macht dann Sinn, wenn man beispielsweise auf Click eine Seite völlig neu mit JS erstellen möchte.

    statt
    <a href="javascript:x()">neue Seite zaubern</a>

    function x() {
     document.open();
     document.write("dein Inhalt");
     document.close();
    }

    enthält die Funktion nur noch:

    function x() {
     return "dein Inhalt";
    }

    Das ist schneller als document.write() und weniger fehleranfällig.

    <a href="seite.html" onclick="window.open(this.href,'neuesFenster');return false;"> ...</a>

    macht Sinn, wenn man z.B. alternative Inhalte anbieten möchte.

    <a href="#" onclick="funktion();return false"> ... </a>

    macht Sinn, wenn man noch für Netscape 4 schreiben muss, in allen anderen Fällen ist das blanker Unsinn und zeugt davon, dass der Entwickler noch an alten Gewohnheiten festhält bzw. was deutlich häufiger ist, nicht weiß, dass es auch anders geht.

    Möchtest du wirklich sauber arbeiten, dann wähle keiner deiner Möglichkeiten, sondern gebe bei Bedarf dem Tagelement oder als Alternative einem Span-Element das Attribut onclick. Und wenn du wirklich Wert auf eine aussagekräftige Statuszeile legst, dann hindert dich niemand daran, dem Element zusätzlich die Eventhandler onmouseover und onmouseout zu verpassen. Da kannst du ganz gezielt eine Statusinformation setzen.

    Auf alle Fälle ist "JavaScript-Anwendung: Bildergalerie" deutlich aussagekräftiger als javascript:Funktion();

    Viele Grüße

    Antje