Ich habe viele <section> in meinem HTML <body> und möchte mehr durch Javascript hinzufügen. Die Verwendung von innerHTML ersetzt jedoch nur meine vorhandenen Abschnitte durch neue, anstatt sie zu den alten hinzuzufügen.Wie fügt man Inhalt zu HTML-Körper mit JS?
Was kann ich verwenden?
können Sie
verwendendocument.getElementById("parentID").appendChild(/*..your content created using DOM methods..*/)
oder
document.getElementById("parentID").innerHTML+= "new content"
Ich würde immer für DOM-Methoden gehen, wo möglich; ['.createElement'] (https://developer.mozilla.org/en-US/docs/DOM/document.createElement), [' .appendChild'] (https://developer.mozilla.org/en-US /docs/DOM/Node.appendChild), ['.insertBefore'] (https://developer.mozilla.org/en-US/docs/DOM/Node.insertBefore), [' .replaceChild'] (https://developer.mozilla.org/en-US/docs/DOM/Node.replaceChild) usw. –
Danke! Das funktioniert großartig. – apr
Ich weiß, das ist eine alte Antwort, aber + = auf innerHTML ist eine nicht gute Möglichkeit, Inhalt an ein Element anzuhängen. Ich habe das + = für ein Element verwendet, auf dem bereits Anzeigen geladen waren, und die Anzeigen sind nach dem Anhängen des Inhalts tatsächlich leer. Durch den Wechsel zu appendChild (element) vs + = "content" wurde das Verschwinden der Anzeige behoben. Nur ein Hinweis für zukünftige Benutzer, die auf dieser Seite von Google gelandet sind :) – Joe
Nur:
document.getElementById('myDiv').innerHTMl += "New Content";
Du bist wahrscheinlich
mitdocument.getElementById('element').innerHTML = "New content"
Versuchen Sie stattdessen:
document.getElementById('element').innerHTML += "New content"
oder vorzugsweise verwenden DOMManipulation:
document.getElementById('element').appendChild(document.createElement("div"))
Dom Manipulation bevorzugt würde im Vergleich zur Verwendung innerHTML, weil innerHTML einfach eine Zeichenfolge in das Dokument Dumps. Der Browser muss das gesamte Dokument analysieren, um seine Struktur zu erhalten.
Bitte nicht w3schools Menschen vorschlagen, es ist nicht offiziell mit w3 verbunden und hat viele Fehlinformationen (siehe http://w3fools.com) –
Danke . Dies ist das gleiche wie oben erwähnt und funktioniert gut. – apr
@PaulS. Wenn Sie ein anderes DOM-Manipulationstutorial für mich haben, werde ich den Link gerne ändern. – Cerbrus
Ich denke, wenn Sie Inhalte direkt auf den Körper aufnehmen wollen, ist der beste Weg:
document.body.innerHTML = "bla bla";
oder
document.body.innerHTML = document.body.innerHTML + "bla bla";
Anfügen statt löschen >> document.body.innerHTML + = "bla bla"; – Trev14
Stellen Sie sicher, dass die <html> Tag oder <p> Tag.
document.getElementsByTagName('html').appendChild("New Content");
oder
document.getElementsByTagName('p')[0].appendChild("New Content");
können Sie die 0 von ändern ^in der Reihenfolge <p>. Wie <p></p><p></p> und es wird an die erste <p> angefügt werden. Kommentar, wenn ein Problem aufgetreten ist.
Versuchen Sie, die folgende Syntax:
document.body.innerHTML += "<p>My new content</p>";
In den meisten Browsern können Sie einen Javascript-Variable verwenden, anstatt document.getElementById zu verwenden.Sagen Sie Ihre HTML-Körper Inhalt ist wie folgt:
<section id="mySection"> Hello </section>
Dann können Sie einfach zu mySection als Variable in Javascript verweisen:
mySection.innerText += ', world'
// same as: document.getElementById('mySection').innerText += ', world'
Sehen Sie diese Schnipsel:
mySection.innerText += ', world!'<section id="mySection"> Hello </section>
Wenn Sie Ihren Code bisher angeben, erhalten Sie eine genauere Angabe ic antwort. – gotohales