Uzyskaj i ustaw wewnętrzny tekst elementów HTML w JQuery
W tym spisie omówi procedurę Dostawać I Ustaw wewnętrzny tekst z Elementy HTML W JQuery. Ponadto podane będą przykłady związane z metodami HTML (), Text () i val (). A więc zacznijmy!
Uzyskaj i ustaw wewnętrzny tekst elementów HTML w JQuery za pomocą metody html ()
Metoda JavaScript html () jest wykorzystywana do uzyskania i ustawienia innerhtml lub zawartości elementów HTML w JQuery. Ta metoda zwraca zawartość pierwszego dopasowanego elementu HTML, jeśli użyjesz go do uzyskania wewnętrznego tekstu; Podczas ustawiania wewnętrznego tekstu zastępuje zawartość wszystkich elementów HTML, które są dopasowane.
Składnia metody html ()
Aby uzyskać wewnętrzny tekst elementów HTML:
$ (selektor).html ()Aby uzyskać i ustawić wewnętrzny tekst elementów HTML:
$ (selektor).HTML (wartość)Aby uzyskać i ustawić wewnętrzny tekst elementów HTML, wykorzystując funkcję:
$ (selektor).html (funkcja (indeks, currentValue))W powyższej składni „wartość”To treść, którą chcesz dodać jako zmodyfikowany wewnętrzny tekst elementów HTML,„indeks”Dodaje się, aby zwrócić pozycję indeksu w zestawie elementu HTML, na koniec”Aktualna wartość”Dodaje się w celu pobrania bieżącego wewnętrznego tekstu określonego elementu HTML.
Przykład: Pobierz i ustaw wewnętrzny tekst elementów HTML w jQuery () za pomocą metody html ()
W poniższym przykładzie zmienimy wewnętrzny tekst wszystkich akapitów, które są dodawane jako elementy HTML z
etykietka. Aby to zrobić, napiszemy następujący kod w naszym „indeks.html" plik:
To pierwszy akapit.
To jest drugi akapit.
Aby manipulować elementami HTML w JQuery, musimy napisać pożądany kod w treści $ (dokument).gotowy() metoda w pliku JavaScript. Tutaj określimy to w „Kliknij„Wydarzenie naszego„przycisk”, Interpreter wybierze wszystko„P„Elementy i ustaw ich treść na ciąg określonym w„html ()" metoda:
$ (dokument).gotowy (funkcja ()$ („przycisk”).kliknij (funkcja ()
$ („p”).html („To jest Linuxhint.com");
);
);
Po zapisaniu dostarczonego kodu w obu plikach otworzymy „indeks.html”Z pomocą kodu VS”Serwer wątroby”:
Teraz klikniemy „Zmień zawartość elementów P”Przycisk, który jest podświetlony w wyjściu:
Ta akcja otrzyma wszystkie elementy akapitu HTML i ustawi ich wewnętrzny tekst w następujący sposób:
Pobierz i ustaw wewnętrzny tekst elementów HTML za pomocą metody Text ()
Zarówno metody Text (), jak i html () są używane w jQuery, aby uzyskać i ustawić wewnętrzny tekst elementów HTML. Jednak kiedy korzystasz tekst() Metoda uzyskania zawartości elementów HTML, usuwa znaczniki HTML po odzyskaniu dopasowanych elementów. Tak więc, jeśli chcesz uzyskać tekst, ustaw tekst i znacznik HTML elementów jednocześnie, idź do wykonania metody html (); W przeciwnym razie metoda Text () sprawiła, że Cię omówi.
Składnia metody Text ()
Aby uzyskać treść elementów HTML:
$ (selektor).tekst()Aby uzyskać i ustawić zawartość elementów HTML:
$ (selektor).tekst (wartość)Aby uzyskać i ustawić zawartość elementów HTML, wykorzystując funkcję:
$ (selektor).tekst (funkcja (indeks, currentValue))Tutaj, "wartość”To treść, którą chcesz ustawić jako tekst elementów HTML,„ ”indeks”Dodaje się, aby zwrócić pozycję indeksu w zestawie elementu HTML, na koniec”Aktualna wartość”Dodaje się w celu odzyskania bieżącej zawartości określonego elementu HTML.
Przykład: Pobierz i ustaw wewnętrzny tekst elementów HTML za pomocą metody Text ()
Teraz wykonamy poprzedni podany przykład za pomocą „tekst()„Metoda uzyskiwania i ustawiania tekstu wszystkich”P„Elementy HTML. Oto kod, który dodaliśmy w „indeks.html" plik:
To pierwszy akapit.
To jest drugi akapit.
W naszym "mój projekt.JS”Plik, wywołamy„tekst()„Metoda ustawienia wewnętrznego tekstu wszystkich elementów akapitu na„To jest Linuxhint.com”:
$ (dokument).gotowy (funkcja ()$ („przycisk”).kliknij (funkcja ()
$ („p”).tekst („To jest Linuxhint.com ”);
);
);
Kliknięcie „Ustaw treść”Przycisk zmieni tekst dodanych elementów akapitu na„To jest Linuxhint.com”:
Pobierz i ustaw wewnętrzny tekst elementów HTML w JQuery za pomocą metody val ()
Po dodaniu elementów formularzy HTML w aplikacji możesz użyć „val ()”Metoda uzyskania i ustawienia wartości atrybutu określonych elementów HTML. Zwraca atrybut pierwszego dopasowanego elementu HTML, gdy jest wywoływany do uzyskania wartości i w przypadku ustawienia wartości atrybutu, zmienia wartość atrybutu dla wszystkich dopasowanych elementów HTML.
Składnia metody val ()
Aby uzyskać wartość atrybutu elementów HTML:
$ (selektor).val ()Aby uzyskać i ustawić wartość atrybutu elementów HTML:
$ (selektor).VAL (wartość)Aby uzyskać i ustawić wartość atrybutu elementów HTML, wykorzystując funkcję:
$ (selektor).val (funkcja (indeks, currentValue))W powyższej składni „wartość”To określona wartość, którą chcesz zmodyfikować dla atrybutu elementu HTML,„indeks”Dodaje się, aby zwrócić pozycję indeksu w zestawie elementu HTML, na koniec”Aktualna wartość”Dodaje się, aby pobrać bieżącą wartość atrybutu wybranego elementu HTML.
Przykład: Pobierz i ustaw wewnętrzny tekst elementów HTML w jQuery za pomocą metody val ()
Poniższy przykład podany zmieni wartość atrybutu „pole wejściowe”To jest dodawane w naszym„indeks.html" plik:
Nazwa:
W tym celu wykorzystamy „mój projekt.JS”Plik do ustawiania jego wartości na„To jest Linuxhint.com”Za pomocą metody val ():
$ (dokument).gotowy (funkcja ()$ („przycisk”).kliknij (funkcja ()
$ („wejście: tekst”).val („To jest Linuxhint.com ”);
);
);
Klikniemy „Ustaw wartość”Przycisk i ciąg„To jest Linuxhint.com”Zostanie ustawione w polu wejściowym:
Powyższe dane wyjściowe deklaruje, że pomyślnie ustaliliśmy wartość dodanego pola wejściowego.
Wniosek
Html (), text () i val () są najbardziej przydatnymi metodami, które można wykorzystać do uzyskania i ustawiania wewnętrznego tekstu elementów HTML w jQuery. Text () Metoda otrzymuje i ustawia zawartość elementów HTML, podczas gdy metoda html () również ustawia swój znacznik HTML. Możesz także wywołać metodę HTML val () do zmiany wartości atrybutów. W tym spisie omówiono metody uzyskania i ustawienia wewnętrznego tekstu elementów HTML w JQuery, podając odpowiednie przykłady.