Jak wstawić element body tag?

Próbuję użyć insertBefore w js TAK:

var p = document.createElement("p");
p.innerHTML = "test1";
document.body.insertBefore(p, null);

var p = document.createElement("p");
p.innerHTML = "test2";
document.body.insertBefore(p, null);

Ale to dodałoby ostatni element p tuż przed zamknięciem znacznika body, Jak mogę go użyć, aby został dodany do góry, gdy się otworzy? Ostatni dodany element będzie więc pierwszym elementem wewnątrz tagu body.

Próbowałem:

document.body.insertBefore(p, document.getElementsByTagName('body')[0]);

Ale firebug pokazuje:

Node was not found " kod: "8

Author: slemdx, 2011-05-16

3 answers

Można uzyskać pierwszy element potomny body z właściwością firstChild. Następnie użyj go jako odniesienia.

var p = document.createElement("p");
p.innerHTML = "test1";
document.body.insertBefore(p, document.body.firstChild);
Insert before this
 68
Author: alex,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-09-10 17:10:48
document.body.prepend(p);

Jest to nowy dodatek w (prawdopodobnie) ES7. Jest to vanilla JS i jest bardziej czytelny niż poprzednie opcje. Jest on obecnie dostępny w 83% przeglądarek, w tym Chrome, FF i Opera.

Możesz bezpośrednio poprzedzać łańcuchy, chociaż nie będą to znaczniki ' p '

document.body.prepend('This text!');

Linki: developer.mozilla.org - Polyfill

 4
Author: Gibolt,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-02-08 18:22:46

Musisz wstawić przed czymś. document.getElementsByTagName('body')[0] jest elementem body (składnia jest pewną sztuczką, aby uzyskać element body we wszystkich przeglądarkach)1. Jeśli chcesz wstawić do ciała, chcesz wstawić przed pierwszym elementem. To może wyglądać tak:

var body   = document.body || document.getElementsByTagName('body')[0],
    newpar = document.createElement('p');
newpar.innerHTML = 'Man, someone just created me!';
body.insertBefore(newpar,body.childNodes[0]);

1w niektórych przeglądarkach jest to document.body, inne document.documentElement itp., ale we wszystkich przeglądarkach tagname jest body

 1
Author: KooiInc,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-08-29 09:37:44