Jak wymienić element HTML za pomocą metody zastępczej w JavaScript?

JavaScript jest powszechnie używany w tworzeniu stron internetowych, a jego biblioteki takie jak JQuery są bardzo przydatne. W starych technologiach było prawie niemożliwe do zmiany lub zastąpienia elementu HTML za pomocą języków skryptów po stronie serwera, byliśmy w stanie zmienić zawartość w elemencie za pośrednictwem języków zaplecza. Ale dzięki JavaScriptowi ułatwiło życie i pozwoliło nam dynamicznie zmienić element strony internetowej.

Zapewnia różne metody osiągnięcia tej funkcjonalności, ale tym, na które będziemy patrzeć w tym poście, jest JQuery's zamienić() metoda.

Przyjrzyjmy się tej metodzie.

JQuery Metoda ()

W jQuery, zamienić() Funkcja służy do zastąpienia wybranych komponentów nowymi i zwraca wymienione komponenty.

zamienić() Składnia metody jest wspomniana poniżej.

$ (element).zamieńWith (newContent, (idx) => )

Argumenty Wyjaśnienie

Oto wyjaśnienie argumentów metody zastępczej ()

• Nowa treść: Jest to treść, która zostanie użyta do wymiany wybranych części.
• (idx) => : To funkcja, która zwraca zawartość wymiany. Ma również wskaźnik argumentów, a ten parametr indeksu służy do zwrócenia pozycji indeksu elementu.

Aby lepiej zrozumieć, jak korzystać z zamienić() funkcja, rozważ następujące przykłady.

Przykład 1

Załóżmy, że mamy Element w naszym HTML, którego identyfikatorem jest „element1”I za kliknięciem przycisku chcemy go wymienić

Część HTML byłaby taka:

Ten tekst jest tagiem div
Zastępować

I za kliknięciem przycisku chcemy wymienić

Teraz, aby całkowicie przekonwertować tag i jego treść do

$ (dokument).gotowy (funkcja ()
$ („#BTN”).kliknij (funkcja ()
$ („#Element1”).zamienić("

Element zastąpiony :)

");
);
);

W powyższym przykładzie po prostu najpierw pobieramy element HTML za pomocą identyfikatorów przycisk I div tag, a następnie zastąpienie tag za pomocą

Tag za pomocą zamienić() metoda.

Wyjście

Możesz być świadkiem, że element został pomyślnie zastąpiony.

Wniosek

JavaScript zamienić() Metoda służy do zastąpienia jednego elementu HTML innym elementem zgodnie z wymogiem. Ten zamienić() Metoda przyjmuje dwa argumenty, pierwszym argumentem jest treść, którą chcesz zastąpić, podczas gdy drugi argument jest używany do zwrócenia pozycji indeksu treści, którą chcesz zastąpić. W tym artykule omówiliśmy przykłady zastąpienia starej treści nową za pomocą jQuery.