Jak zamienić tag znacznika na inny wewnątrz kodu HTML za pomocą JavaScript

0

Jak zamienić tag znacznika na inny wewnątrz kodu HTML za pomocą JavaScript?

0

Jeżli za pomocą jQuery to replaceWith

0

Co znaczy zmienić TAG?
W DOM TagName nie można zmienić ale:

  1. Chodzi zmianę typu elementu w drzewie DOM? ( stworzyć nowy, przepiąć wszystkie child'y i usunąć stary ).
  2. Zmianę w podglądzie kodu źródłowego? ( nie da się )

Najważniejsze pytanie... Jaki masz w tym cel? Bo wg mnie wygląda to na działanie mocno bezsensowne.

0

Podgląd
@katakrowa: Weźmy dokument z nagłówkiem h1 z pewną treścią pod nim, a w tym tekście jest ściąganie strony, w którym też jest h1, ale z normalnym tekstem, i chcę to ostatnie h1 zamienić na h2. Czyli chcę załadować z poziomu pierwszego dokumentu z h1 drugi dokument z h1, a to zamieniamy h2, bo ten drugi dokument jest podrozdziałem tego pierwszego. A tagiem TAG może być np. H2.

0

Ok. Ale w jakim celu?
W JavaScript to i tak nie zmieni postrzegania dokumentu z punku widzenia SEO czy poprawności struktury HTML.
Czy może chodzi o style...

0

@katakrowa: Tu nie chodzi o style, tylko zamianę tagu z h1 na h2 w drugim dokumencie w pierwszym, w którym jest h1. A znaczniki H z liczbą, np.: h1,h2,h3,h4,h5,h6, ro zawartość jest w kierunku od rozmiaru czcionki największego do najmniejszego. A ten drugi dokument jest ładowanym dynamicznie w pierwszym dokumencie, i tam dynamicznie jest zamieniany tag, a w drugim dokumencie, nie wiadomo jakie tagi, np.: h1,h2, dalej, występują, a ja chcę by był porządek.

2

W JS musisz wykonać 3 kroki:

  1. Odnaleźć tag (np. za pomocą document.querySelector albo document.getElementById, document.getElementsByClassName, document.getElementsByTagName)
  2. Uworzyć nowy tag, którym chcesz zastąpić stary za pomocą document.createElement
  3. Na koniec odwołując się do rodzica taga z pkt. 1 zamieniasz tag

Przykładowy kod:

//przy założeniu, że masz tylko jeden h1 w dokumencie
const h1 = document.querySelector('h1');
const h2 = document.createElement('h2');
h2.innerText = h1.innerText;
h1.parentNode.replaceChild(h2, h1);

1 użytkowników online, w tym zalogowanych: 0, gości: 1