Potrzebuję sposobu, aby dołączyć kod HTML do elementu kontenera bez użycia innerHTML. Powodem, dla którego nie chcę używać innerHTML, jest to, że kiedy jest używany w ten sposób:
element.innerHTML += htmldata
Działa poprzez zastąpienie całego kodu HTML przed dodaniem starego i nowego HTML. To nie jest dobre, ponieważ resetuje dynamiczne multimedia, takie jak osadzone filmy flash ...
Mógłbym to zrobić w ten sposób, który działa:
var e = document.createElement('span');
e.innerHTML = htmldata;
element.appendChild(e);
Jednak problem z tym sposobem polega na tym, że w dokumencie jest teraz dodatkowy tag span, którego nie chcę.
Jak więc można to zrobić? Dzięki!
javascript
html
innerhtml
Pion
źródło
źródło
Odpowiedzi:
Aby dać alternatywę (ponieważ używanie
DocumentFragment
wydaje się nie działać): Możesz to zasymulować, iterując po elementach potomnych nowo wygenerowanego węzła i tylko je dołączać.źródło
e.firstChild
. Raczej sprawdza, czye
ma dziecko, a jeśli tak, przesuń to dziecko do elementu.Dziwię się, że żadna z odpowiedzi nie wspomina o
insertAdjacentHTML()
metodzie. Sprawdź to tutaj . Pierwszym parametrem jest miejsce, w którym chcesz dołączyć ciąg i trwa („przed rozpoczęciem”, „po rozpoczęciu”, „przed końcem”, „po”). W sytuacji OP użyłbyś „przed końcem”. Drugi parametr to po prostu ciąg html.Podstawowe użycie:
źródło
Uncaught TypeError: undefined is not a function
!alnafie ma świetną odpowiedź na to pytanie. Chciałem podać przykład jego kodu w celach informacyjnych:
Mam nadzieję, że jest to pomocne dla innych.
źródło
przypisz dane do div za pomocą symbolu „+ =”, możesz dołączyć dane, w tym poprzednie dane HTML
źródło
element.innerHTML += data
.Do tego
DocumentFragment
było przeznaczone.document.createDocumentFragment
,.childNodes
źródło
(a)
? Czy to literówka.Jak łowić i używać ścisłego kodu. Na dole tego wpisu potrzebne są dwie funkcje wstępne.
Dodaj wiele elementów (przestrzeń nazw musi znajdować się tylko w elemencie nadrzędnym):
Dynamiczny kod wielokrotnego użytku:
źródło