JQuery .HTML vs .dodać

JQuery .HTML vs .dodać
"JQuery”To biblioteka JavaScript i„.html ()" I ".dodać()„Oba są metodami stosowanymi w jQuery. Obie metody wykonują różne zadania w funkcji JavaScript. „„.Metoda html () ”służy do całkowitego zastąpienia treści na interfejsie strony internetowej. Z drugiej strony „.Metoda append () ”służy do dodawania nowej treści na końcu istniejącej treści, nie zmieniając poprzedniej treści, w przeciwieństwie do„.metoda html () ”.

Oto jak ".html () ”i„.Metody dodatkowe () ”różnią się od siebie i wykonują różne operacje JavaScript. Praktycznie zrozummy różnicę między nimi za pomocą przykładów.

Jak używać „.metoda html () ”?

Powinien istnieć kod HTML, aby najpierw sformatować dokument:

To jest pierwsza linia


To jest druga linia


  • W powyższym fragmencie kodu istnieją dwie klasy o nazwie Demo w tagach akapitowych, aby dodać zawartość na stronie internetowej i poniżej, że istnieje przycisk o nazwie Treść, która zostanie użyta do zmiany zawartości za pomocą metody metody html ().

Powinna istnieć funkcja JavaScript do wdrożenia „.html ()„Metoda powyższego nadwozia dokumentu. Poniżej znajduje się przykład, w jaki sposób „.html ()„Metoda jest zaimplementowana w JavaScript:

$ (dokument).gotowy (funkcja ()

$ („przycisk”).kliknij (funkcja ()
$ (".próbny").html („To jest nowy tekst”);
);
);
  • W powyższej funkcji zagnieżdżonej JavaScript istnieje funkcja, która ma metodę gotowy, tak, że gdy interfejs HTML ładuje się na stronie internetowej, ta funkcja staje się aktywna.
  • Wewnątrz funkcji jest „.Kliknij„Metoda wywołania tej funkcji z elementem„przycisk".
  • W środku jest treść napisana „.html". Oznacza to, że gdy użytkownik kliknie „Zmień treść”Przycisk wywoła„.html ()„Metoda i ta treść („ to jest nowy tekst ”) napisane w„.html ()„Metoda zastąpi starą zawartość.

Interfejs wyjściowy generowany przez powyższy kod będzie następujący:

W ten sposób „.html ()„Metoda działa na interfejsie strony internetowej.

Jak używać „.Metoda append () ”?

Teraz zobaczmy, jak „.dodać()„Metoda jest inna i sposób działania na stronie internetowej. „„.dodać()„Metoda może dodawać treść po istniejącej zawartości po prawej stronie treści, a także poniżej treści. Abyśmy mogli dodać przyciski dla obu operacji:

Witaj świecie!



  1. Pierwsza linia

  2. Druga linia

  3. Trzecia linia



  • W powyższym fragmencie kodu są trzy wiersze do wyświetlania na interfejsie strony internetowej jako istniejąca treść strony internetowej.
  • A potem są dwa przyciski, jeden do dołączenia tekstu (w celu rozszerzenia zawartości po prawej stronie tekstu), a drugi, aby dołączyć listę (aby dodać zawartość poniżej istniejącej zawartości).

Aby utworzyć funkcję JavaScript dla powyższego fragmentu kodu, powinno istnieć „.dodać()„Metoda zarówno„Dodaj tekst" I "Lista dołączona" guziki:

$ (dokument).gotowy (funkcja ()
$ („#Button1”).kliknij (funkcja ()
$ („#a”).dodać(" Dodaj tekst");
);
$ („#Button2”).kliknij (funkcja ()
$ („ol”).dodać("
  • Lista dołączona
  • ");
    );
    );
    • W powyższym fragmencie kodu istnieje funkcja, która otrzymuje metodę gotową do wywołania funkcji po załadowaniu strony internetowej.
    • Wewnątrz funkcji „.dodać()„Metoda jest stosowana zarówno dla„przycisk 1" I "Button2" elementy.

    To wygeneruje następujące dane wyjściowe:

    To była różnica między „.html ()" I ".dodać()„Metody jQuery.

    Wniosek

    „„.html ()" I ".dodać()„Oba są metodami stosowanymi w„JQuery". Kiedy "html ()„Zastosowana jest metoda, zastępuje starą zawartość nową zawartością dodaną w„html ()" metoda. Z drugiej strony, kiedy „dodać()„Zastosowana jest metoda, dodaje treść po istniejącej zawartości bez zmiany lub usuwania starej treści.