2016-04-19 10 views
1

Ich versuche, JavaScript zu verwenden, um neue Elemente in meine HTML-Datei einzufügen.Element in Header einfügen

Meine HTML-Datei sieht wie folgt aus

<header> 
</header> 
<section> 
</section> 
<main> 
    <p id="time"></p> 
</main> 
<footer> 
</footer> 
<script src="first.js"> 
</script> 

Ich habe Elemente für jetzt nur in dem Body-Tag eingeführt wird, durch die Verwendung

var h1 = document.createElement('h1'); 
var content = document.createTextNode('text'); 
h1.appendChild(content); 
document.body.appendChild(h1); 

Wenn JavaScript Elemente einfügt, es setzt sie nur an der Boden der HTML-Datei,

<footer> 
</footer> 
<script src="first.js"> 
</script> 
<h1>text</h1> 

ich möchte wissen, wie die Elemente eingefügt werden direkt in zu meinen HEADER-Tags OHNE IDs oder andere Divs zu verwenden.

<header></header> 

Gefallen Sie diesen

<header> 
    <h1>text</h1> 
</header> 
<section> 
</section> 
<main> 
    <p id="time"></p> 
</main> 
<footer> 
</footer> 
<script src="first.js"> 
</script> 

Dank !!!

Antwort

4

können Sie document.getElementsByTagName('header')[0].appendChild(h1);

jsFiddle example

verwenden können Sie auch so etwas wie dies versuchen:

// Get all headers 
var headers = document.getElementsByTagName('header'); 

headers[0].appendChild(h1); // inserts into first header 
headers[1].appendChild(h1); // inserts into second header 
// And so on... 

Auch können Sie Schleife. Alternativ ist querySelector eine weitere Option.

+3

Süß !!! Das hat funktioniert !!! Danke !!! –

Verwandte Themen