Hudriwurz: javascript Object erstellen

Hallo, habe das Problem, kein Objekt erstellen zu können. Löschen kann ich schon:

var element = document.getElementById('fond');

if (element)
	{
	alert(document.getElementById("fond"));

	var element = document.getElementById("fond");
	element.parentNode.removeChild(element);
	

	}
else
	{
	addElement ();
	}

function addElement () 
{ 
  // erstelle ein neues div Element
  // und gib ihm etwas Inhalt
  var newDiv = document.createElement("div"); 
  var newContent = document.createTextNode("Hi there and greetings!"); 
  newDiv.appendChild(newContent); // füge den Textknoten zum neu erstellten div hinzu.

  // füge das neu erstellte Element und seinen Inhalt ins DOM ein
  var currentDiv = document.getElementById("div1"); 
  document.body.insertBefore(newDiv, currentDiv); 
  alert("da bin ich...");
}

wäre super, wenn mir irgendwer helfen könnte. Vielen Dank

Emanuel

  1. Hallo Hudriwurz,

    Schau in die Entwicklertools deines Browsers, dort gibt es eine Konsole. Füge deinen Code dort ein und führe ihn aus. Lies die Fehlermeldungen.

    Bis demnächst
    Matthias

    --
    Dieses Forum nutzt Markdown. Im Wiki erhalten Sie Hilfe bei der Formatierung Ihrer Beiträge.
  2. Ich habe Deinen Code mal auf das wesentliche reduziert ...

    <! doctype html>
    <html>
        <head>
            <meta charset="utf-8">
        </head>
        <body>
            <div id="div1">
                <div>Ursprünglich erster Item</div>
            </div>
            <script>
                function addElement () {
                    var newDiv = document.createElement("div");
                    var newContent = document.createTextNode("Eingefügter Item");
                    newDiv.appendChild(newContent);
                    var currentDiv = document.getElementById("div1");
                    document.body.insertBefore(newDiv, currentDiv);
                }
                addElement();
            </script>
        <body>
    </html>
    

    ... und sah: Geht doch?

    Alternativ-Text

    1. Frei nach Tolkien: All that is script does not glitter...

      Das Script glitzert wahrlich nicht, und eine Rakete zum Mond schießen sollte man damit auch nicht, aber es ist nicht per se falsch. Ich hab's mal gefiddelt - und bekomme nicht mal eine Warnung wegen des doppelten var.

      Meine Vermutung: Das HTML, gegen das der OP sein Script laufen lässt, entspricht nicht den Erwartungen des Scripts. Man müsste es mal gezeigt bekommen.

      Gruß Rolf

    2. Das Internet meint, es sollte so funktionieren:

      function addElement () 
      {
          var newElement = document.createElement("BUTTON");
          var newContent = document.createTextNode("Knopf");
          newElement.appendChild(newContent);
          document.body.appendChild(newElement);
      } 
      

      http://www.w3schools.com/jsref/met_document_createelement.asp

      Es geht leider nicht. Ich verwende Safari auf meinem Mac

      Ich habe Deinen Code mal auf das wesentliche reduziert ...

      <! doctype html>
      <html>
          <head>
              <meta charset="utf-8">
          </head>
          <body>
              <div id="div1">
                  <div>Ursprünglich erster Item</div>
              </div>
              <script>
                  function addElement () {
                      var newDiv = document.createElement("div");
                      var newContent = document.createTextNode("Eingefügter Item");
                      newDiv.appendChild(newContent);
                      var currentDiv = document.getElementById("div1");
                      document.body.insertBefore(newDiv, currentDiv);
                  }
                  addElement();
              </script>
          <body>
      </html>
      

      ... und sah: Geht doch?

      Alternativ-Text

      1. Dieses funktioniert vorzüglich:

        <! doctype html>
        <html>
            <head>
                <meta charset="utf-8">
            </head>
            <body>
                <h1>Test</h1>
                <script>
                function addElement ()  {
                    var newElement = document.createElement("button");
                    var newContent = document.createTextNode("Knopf");
                    newElement.appendChild(newContent);
                    document.body.appendChild(newElement);
                }
                addElement();
               </script>
            <body>
        </html>
        

        Bitte folge dem Rat von Matthias Apsel. Hilfe hierzu.

        Außerdem wäre es, wie Rolf b schon anmerkte, hilfreich, uns das zugehörige HTML zu zeigen und darüber hinaus ist es erste Pflicht, das HTML vor "Javascript- und/oder CSS-Experimenten" zu prüfen.

        1. Vielen Dank, funktioniert wirklich super,aber:

          im Widget für's Dashboard (am Mac) will er das nicht Kann man halt nix machen.

          Danke jedenfalls, für die Bemühungen.

          [Vollzitat entfernt]

          1. Widget für's Dashboard (am Mac)

            Google weiß alles

    3. @@Dein Lehrer

      <! doctype html>
      

      ... und sah: Geht doch?

      Browser in den Quirksmodus zu schicken würde ich nicht unter „Geht doch“ laufen lassen.

      Zwischen ! und doctype darf kein Leerzeichen sein:

      <!DOCTYPE html>
      

      LLAP 🖖

      --
      “You might believe there are benefits for the developer, but first of all, you should put those behind the interest of the user.” —Stefan Tilkov
      Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
  3. Lieber Hudriwurz,

    Du darfst eine Variable nur einmal mit var deklarieren.

    Liebe Grüße,

    Felix Riesterer.

    1. @@Felix Riesterer

      Du darfst eine Variable nur einmal mit var deklarieren.

      Sagt wer?

      LLAP 🖖

      --
      “You might believe there are benefits for the developer, but first of all, you should put those behind the interest of the user.” —Stefan Tilkov
      Selfcode: sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|
    2. Hallo Felix

      Du darfst eine Variable nur einmal mit var deklarieren.

      Weil sonst was passiert? ;-)

      Die mehrfache Deklaration von Variablen mit var innerhalb derselben lexikalischen Umgebung ist laut Spezifikation ausdrücklich erlaubt und führt weder im Sloppy Mode noch im Strict Mode dazu, dass eine Ausnahme geworfen wird. Das ist eine der unwillkommenen Eigenheiten dieses Variablentyps und ein weiterer Grund dafür, besser const und let zu verwenden.

      var x = 1;
      
      var x = 2;
      
      console.log(x); // 2
      

      Wenn derselbe Bezeichner bei mehr als einer Deklaration im selben Gültigkeitsbereich auftaucht, dann wird bei der Initialisierung des Ausführungskontextes schlicht und ergreifend nur eine Variable definiert und die anderen Deklarationen werden als normale Zuweisungsausdrücke behandelt.

      var x = 1;
      
      x = 2;
      
      console.log(x); // 2
      

      Bei einer Variablendeklaration mit let sieht das allerdings anders aus. Unabhängig davon, in welchem Modus das Programm ausgeführt wird, führt eine Mehrfachdeklaration hier immer dazu, dass ein Fehler produziert wird.

      let x = 1;
      
      let x = 2; // syntax error
      

      Ich denke, Emanuel war sich hier nicht bewusst, dass Variablen die mit var deklariert werden keinen Block Scope haben, sie also prinzipiell überall innerhalb des Codes sichtbar sind, der mit einem Ausführungskontext assoziiert ist. Also für den Fall, dass er hier noch mitliest:

      if (true) {
        var x = 1;
      }
      
      console.log(x); // 1
      

      Der Anweisungsblock eines Conditional Statements wie in dem Beispiel oben stellt für Variablen die mit var deklariert werden keinen eigenen Gültigkeitsbereich dar. Das heißt, eine Variable die innerhalb eines solchen Blocks deklariert wird, ist grundsätzlich auch außerhalb sichtbar und kann entsprechend referenziert werden. Darum handelte es sich bei der Variable Namens element im geposteten Code um eine Redeklaration, die wie gesehen zwar erlaubt, aber sehr schlechter Stil ist.

      function fn ( ) {
        var x = 1;
        console.log(x);
      }
      
      var x = 2;
      console.log(x); // 2
      
      fn( ); // 1
      

      Ein Gültigkeitsbereich für Variablen die mit var deklariert werden wird also immer nur über einen Ausführungskontext definiert, was entweder ein globaler Kontext sein kann, oder eben der Kontext von Funktionen. Man kann sich also merken, dass solche Variablen immer funktionsweit sichtbar sind und alle Blöcke, die nicht den Körper einer Funktion umschließen entsprechend keinen Gültigkeitsbereich für Variablen definieren, die mit var deklariert werden.

      Viele Grüße,

      Orlok