• Guten Abend zusammen,


    ich bin mal zufällig bei html auf ein js-video gestoßen und habe es mir mal angeschaut. Hab dann bissl getestet und meine Frage:


    Ist es ok in den einzelnen html-tags diesen Eventhandler reinzuschreiben und den dann im <script> tag zu definieren? , so wie hier :


    Und bei dem prombt wenn er einen Namen das erste mal nicht eingibt habe ich ja ihm dann einen 2. Versuch gegeben seinen Namen einzugeben. Nun wie kann man diesen Personen die einen Namen nicht eingeben den Zugriff auf die Seite verweigern?
    Oder wie würdet ihr es machen? Was findet ihre besser?
    Habt ihr Tipps für einen Anfänger in js?
    __________________________________________


    u.a. ne frage zu html (möchte nicht noch ein Thema wegen dem erstellen), ich habe gelesen das die nav-tags veraltet sind und diese eigentlich weggelassen werden können bei einer Navigation. Was meint ihr ?


    Freue mich auf eure Hilfe ^^


    Stef

  • Woher hast du denn die Info, dass der Nav-Tag veraltet ist? Das ist HTML5. Würde mich extrem wundern, wenn das irgendwo steht.


    Und warum hat jedes li-Element die gleiche ID? Das ist eigentlich nicht der Sinn der Sache, eine ID sollte nur in jeder Datei einmal erscheinen. Bei mehrfacher Nutzung ist eine Klasse zu empfehlen.


    Bei dem JS-Zeug kann ich dir leider nicht helfen..

  • Ich habe ein Youtube Video angschaut wo derjenige es gesagt hat. Hab nun nochmal nachgeschaut und gut das es zu html5 gehört.


    Ja die ids hab ich nur zum test gemacht und nicht wieder entfernt. Wollte was ausprobieren.


    Aber mann kann doch z.b. jetzt jedem link eine andere id geben und diese mit den js-befehl

    JavaScript
    1. getElementbyID('Hier der ID name');

    und dann brauch man ja dies nicht in den html tags zu schreiben ?


    Stef

  • 1. Verstehe nicht ganz, was du meinst. Hat derjenige jetzt gesagt, dass der Nav-Tag veraltet ist oder nicht? Weil dann würde ich das mal gerne sehen.


    2. Jep, soweit ich weiß schon. Aber es gibt auch getElementsByClassName(), was in diesem Fall besser wäre. Dann brauchst du nicht die mehreren gleichen IDs.

  • Hi.


    @JR Cologne:


    Ich glaube es gehört zu haben aber ich finde das video nichtmehr. Aber egal jetzt. Jetzt weiß ich das es doch nicht veraltet ist und zu HTML5 gehört.
    Ok, danke für den tipp.


    Basi :


    Ich habe ja dann mal es getestet und da hab ich ja den Eventhandler onClick in die einzelnen html tags reingeschrieben und dann angesprochem im script-tag. Und mir erscheint es viel zu unordentlich, weil man dann mal bei größeren Sachen leicht den Überblick verlieren kann. Gibt es eine andere Möglichkeit den Eventhandler onClick zu verwenden ohne das man diesen in die HTML-Tags schreibt ?


    Stef

  • Das kann man natürlich übersichtlicher halten :)


    HTML
    1. <div id="click">Klicken</div>
    2. <div id="click2">Mit der Maus überfahren</div>



    Der Javascript Abschnitt muss im Quelltext hinter den benutzten HTML-Elementen auftauchen, oder in einem onload Event des window Objektes aufgerufen werden, ansonsten können die Elemente nicht gefunden werden:



    In deinem Beispiel würde ich dann so vorgehen:


    HTML
    1. <ul class="link" id="mainMenu">
    2. <li><a title="Das ist die Startseite" href="#1">Startseite</a></li>
    3. <li><a title="Das ist die Bildergalerie" href="#2">Bilder</a></li>
    4. <li><a title="Das ist die Tiergalerie" href="#3">Tiere</a></li>
    5. <li><a title="Das ist die Blumengalerie" href="#4">Blumen</a></li>
    6. <li><a title="Das ist die Neon-Seite" href="#5">Neon</a></li>
    7. <li><a title="Das ist die PC-Seite" href="#6">Pcs</a></li>
    8. <li><a title="Das ist die Websprachenseite" href="#7">Websprache</a></li>
    9. </ul>



    Wenn du das title-Attribut nicht verwenden willst (beim Überfahren mit der Maus wird der Inhalt davon dem Benutzer angezeigt), kannst du auch das dataset benutzen:


    HTML
    1. <ul class="link" id="mainMenu">
    2. <li><a data-title="Das ist die Startseite" href="#1">Startseite</a></li>
    3. <li><a data-title="Das ist die Bildergalerie" href="#2">Bilder</a></li>
    4. <li><a data-title="Das ist die Tiergalerie" href="#3">Tiere</a></li>
    5. <li><a data-title="Das ist die Blumengalerie" href="#4">Blumen</a></li>
    6. <li><a data-title="Das ist die Neon-Seite" href="#5">Neon</a></li>
    7. <li><a data-title="Das ist die PC-Seite" href="#6">Pcs</a></li>
    8. <li><a data-title="Das ist die Websprachenseite" href="#7">Websprache</a></li>
    9. </ul>