JavaScript: createElement a literały szablonowe

Nov 28 2022
Kilka dni temu, podczas budowania projektu, zadano mi pytanie, które naprawdę mnie zaintrygowało, aby je znaleźć i przeczytać. Pytanie brzmiało: „Co by się stało, gdybym użył łańcuchów szablonów zamiast createElement do tworzenia elementów HTML? Czy to robi jakąś różnicę? Oba „dokumenty.

Kilka dni temu, podczas budowania projektu, zadano mi pytanie, które naprawdę mnie zaintrygowało, aby je znaleźć i przeczytać. Pytanie brzmiało:

„Co by się stało, gdybym użył łańcuchów szablonów zamiast createElement do tworzenia elementów HTML? Czy to robi jakąś różnicę?

Zarówno „ document.createElement() ”, jak i „ literały szablonowe ” pozwalają nam tworzyć elementy, więc pojawia się pytanie, kiedy czego użyć? Czy to ma jakieś znaczenie, czy użyjemy któregoś z nich, czy je zastąpimy? Dowiesz się, czytając dalej.

createElement() v/s literały szablonów

utwórz element ()

  • Metoda createElement() jest funkcją DOM poziomu 1, wprowadzoną w 1998 roku.
  • Jest stary i solidny, ale potem pojawia się redundancja, gdy od czasu do czasu musimy tworzyć elementy.
  • Obsługa funkcji createElement() przez przeglądarkę jest dobra i wynosi 97,92 % .
  • Literały szablonów zostały wprowadzone w ES6, czyli ECMAScript 6, w 2015 roku.
  • Jest nowszy, szybszy, ma mniej kodu, większą czytelność, jest łatwy w utrzymaniu i ma mniejsze szanse na radzenie sobie z błędami.
  • Obsługa łańcuchów szablonów przez przeglądarkę wynosi 97,11% , co nie jest dużą różnicą w porównaniu z createElement(), ale oto rzecz, w której literały szablonów nie działają w IE 11, Operze i BlackBerry.

Poniżej znajduje się przykładowy fragment kodu służący do dodawania elementów HTML przy użyciu literałów createElement i szablonu.

sposób JS

Alternatywa z literałami szablonowymi

Wniosek

Jak widać nawet w powyższym przykładowym kodzie, nie ma dużej różnicy, kiedy tworzymy elementy za pomocą metody createElement() lub przy użyciu łańcuchów szablonów. Tak więc odpowiedź na pytanie sprowadza się do wyboru tego, co będzie dla Ciebie najlepsze wraz z przeglądarką, z którą znoszą użytkownicy aplikacji. Ponieważ IE11, Opera i Blackberry nie obsługują jeszcze łańcuchów szablonów, możesz wybrać metodę createElement() .