Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
insertBefore-Methode funktioniert nicht
#1
Hi,
ich bin gerade am verzweifeln und habe via Google, bereits x Seiten gecheckt. Ich finde den Fehler nicht obwohl an der Syntax alles passen müsste.
Inzwischen habe ich einen kleinen Testschnipsel herausgenommen und es nochmal damit versucht. Aber auch hier läuft die insertBefore-Methode nicht.
Ich weiß nicht was ich falsch mache, aber wahrscheinlich ist es nur eine Kleinigkeit.

Wahrscheinlich werden viele jetzt einen Lachkrampf bekommen, aber gut... Bin halt JS-Anfänger.

Hier nun mein Codeschnipsel:

<body>

    <input type="button" id="idNew_paragraph" value="neues p-Element">
    <p id="idErster_paragraph">Von Anfang an bestehender Paragraph.</p>


    <script>
        "use strict"

        var new_paragraph = document.getElementById("idNew_paragraph");
        var first_p = document.getElementById("idErster_paragraph");

        new_paragraph.addEventListener("click", ()=> {
            var new_p = document.createElement("p");
            new_p.innerText = "Das ist ein neu hinzugefügter Paragraph.";
            //document.body.appendChild(new_p);         //funktioniert wuderbar
           
            first_p.insertBefore(new_p);                //funktioniert nicht, keine Ahnung warum
        });
       
    </script>
</body>


Ich will es gern verstehen woran es hängt. Daher bin ich für eine kurze Erläuterung sehr dankbar.

Liebe Grüße
Marco
Zitieren
#2
(02.06.2023, 10:54)Marco schrieb: Wahrscheinlich werden viele jetzt einen Lachkrampf bekommen, aber gut... Bin halt JS-Anfänger.

Es ist nicht schlimm Anfänger zu sein; Wir waren das doch alle mal und haben viel lächerliche Fehler gemacht...

Dein Problem besteht dadurch, dass die Methode insertBefore 2 Parameter erfordert.
- Der Erste ist der Knoten, den du einfügen möchtest
- Der Zweite ist der Knoten, VOR den du deinen neunen Knoten einfügen möchtest. (Wenn dieser nicht existiert passiert nichts. - Nicht einmal ein Fehler in der Konsole)

Wenn es darum geht, das Element immer am "Anfang" einzufügen, kann ich dir auch die Methode (mit dem schwer zu merkenden Namen) insertAdjacentElement empfehlen, die benötigt nur die Position und keinen weiteren Knoten. In deinem Fall warscheinlich afterbegin.
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen:
2 Gast/Gäste