Du weißt ja, ich will immer alles nicht nur machen, sondern muss was ich mache auch verstehen:
Get the first element with a class of 'test', or undefined if there is no matching element
Code: Alles auswählen
getElementsByClassName('eindeutigeKlasse')[0].getElementsByTagName('a')
Die [0] hatte ich nicht dabei, was ist das für ein Parameter in JavaScript und was macht der genau, was heißt jetzt hier "undefined" (nicht definiert) - Classes sind doch immer definiert.
Das Problem, das mich hier viele Stunden beschäftigt hatte, war eben der obere Teil des Navi-Codes:
Der Bereich <!-- Logo und Name in Navi --> wird mit dem jetzigen Script auch erkannt wenn im Script in der FOR Schleife der Zähler i=0 ist (logisch, weil es ja auch <a> Tags hat).
Um diese beiden <a> zu überspringen habe ich diesen Zähler eben gleich auf i=2 gesetzt.
Außerdem hat der
Name(hier "Mobirise") immer ein <a> Tag, mit oder ohne gesetzten Link, das ist fatal und so von Mobirise falsch programmiert.
Also wollte ich den gesamten Bereich aussparen, was dann mit 2 x einer Class eigentlich gehen sollte, denn eine ID darf ich ja nicht doppelt verwenden.
Code: Alles auswählen
<!-- Logo und Name in Navi -->
<div class="navbar-brand">
<span class="navbar-logo">
<a href="https://www.mobirise-tutorials.com/" target="_blank">
<img src="assets/images/logo-mobirise-250x250.png" alt="" title="Mobirise-Tutorials" style="height: 4.7rem;">
</a>
</span>
<span class="navbar-caption-wrap"><a class="navbar-caption text-black display-7" href="https://www.mobirise-tutorials.com/" target="_blank">Mobirise</a></span>
</div>
Im Anschluss steht dann gleich der Hamburger Button, der nicht vom Script ausgespart werden darf, denn sonst kann man den Hamburger Button nicht mehr klicken.
Also dachte ich mir, OK - dann setze ich eben die id="mynav" nicht an das <nav> Tag, sondern beginne vor dem Hamburger Button hier mit einem neuen <div id="mynav">.
Das geht dann zwar aber die gesamte Formatierung von Mobirise gerät im Hamburger-Menü restlos durcheinander. Die Links stehen dann ganz rechts und mein Logo irgendwo mitten drinnen unten. Das passiert wohl, weil ein äußeres <div> weiter oben, alle die hierfür benötigten Classes trägt, die so außer Kraft gesetzt werden.
Code: Alles auswählen
<!-- Hamburger Button -->
<button class="navbar-toggler" type="button" data-toggle="collapse" data-bs-toggle="collapse" data-target="#navbarSupportedContent" data-bs-target="#navbarSupportedContent" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<div class="hamburger">
<span></span>
<span></span>
<span></span>
<span></span>
</div>
</button>
Insofern hätte ich wahrscheinlich dann mit zwei mal der class="mynav" genau das gleiche Problem.
Ich lasse das also jetzt so, wollte nur anfangen zu verstehen, wie das mit der Class überhaupt funktioniert. Ich habe das Problem nämlich hier nicht zum ersten Mal, immer wieder funktioniert bei mir "getElement" mit der ID aber nie mit der CLASS.