Uzyskaj wartość elementu za pomocą JavaScript

Czasami programiści chcą zmienić wartość dowolnego elementu, więc potrzebują najpierw, aby uzyskać element, a następnie sprawdź wartość określonego elementu. Następnie zastosuj do nich operacje. Aby uzyskać odniesienie elementu i jego wartość, JavaScript oferuje pewne predefiniowane metody lub właściwości.

Ten samouczek wyjaśni, jak uzyskać wartość elementu za pomocą JavaScript.

Jak uzyskać wartość elementu za pomocą JavaScript?

Aby uzyskać wartość elementu HTML, użyj „wartość„Własność interfejsu HTMLDataElement.

Aby uzyskać odniesienie do elementu, stosuje się wiele metod

• metoda getelementById ()
• metoda getelementBlass ()
• Metoda getElementByTagname ()
• Metoda QuerySelector ()
• Metoda QuerySelectorall ()

Tutaj najczęściej stosowane metody z „wartość„Omówiono własność.

Przykład 1: Pobierz wartość elementu za pomocą właściwości wartości z metodą getElementById ()

Aby uzyskać wartość elementu, użyj „wartość„Nieruchomość z„getElementById ()„Metoda uzyskania odniesienia elementu za pomocą jego przypisanego„ID".

Najpierw utwórz formularz w pliku HTML, z polem wejściowym i przyciskiem, które wyświetli wprowadzoną wartość w polu tekstowym w „Kliknij" wydarzenie:

Uzyskaj wartość pola wejściowego

Postępuj zgodnie z poniższymi wierszami kodu:

funkcja getElementValue ()
var wartość = dokument.getElementById („tekst”).wartość;
alert (wartość);

W powyższym fragmencie kodu:

• Najpierw zdefiniuj funkcję „getElementValue ()".
• Następnie pobieraj element jego id ”tekst”I odzyskaj jego wartość za pomocą„wartość„Własność i przechowuj w zmiennej”wartość".
• Na koniec pokaż wartość elementu w komunikacie ostrzegawczym.

Wyjście

Powyższe dane wyjściowe wskazuje, że wartość elementu jest pomyślnie pobierana za pomocą właściwości wartości za pomocą metody getElementById ().

Jak uzyskać odniesienie elementu bez określonego identyfikatora? Postępuj zgodnie z poniższą sekcją.

Przykład 2: Pobierz wartość elementu za pomocą właściwości wartości z metodą QuerySelelect ()

Innym sposobem uzyskania odniesienia do elementu, aby uzyskać jego wartość, jest użycie „QuerySelelect ()" metoda. To wymaga „selektor”Nazwy elementu jako argumentu i podaje pierwszy element dokumentu, który pasuje do danego selektora.

Najpierw utwórz rozwijane menu za pomocą tag i przycisk, który wywoła „getElementValue ()„Funkcja uzyskania wartości wybranej opcji:

Wybierz język, którego chcesz się nauczyć:

Html
CSS
JavaScript
Jawa
Pyton



Uzyskaj wartość pola wejściowego

W pliku JavaScript użyj następującego kodu:

funkcja getElementValue ()
var wartość = dokument.QuerySelelect („Wybierz”).wartość;
alert (wartość);

W powyższych wierszach kodu:

• Zdefiniuj funkcję „getElementValue ()".
• Następnie zadzwoń do „QuerySelelect ()„Metoda, przekazując selektor”wybierać„Element z„wartość„Właściwość, która otrzymuje wybraną wartość menu rozwijanego.
• Na koniec pokaż wybraną wartość elementu w komunikacie ostrzegawczym.

Wyjście wyświetla wybrane wartości w komunikacie alertów:

Wniosek

Aby uzyskać wartość elementu DOM, użyj „wartość„Własność interfejsu HTMLDataElement z różnymi metodami otrzymywania odniesienia elementu, takich jak„getElementById ()" metoda, "getElementBlass ()„Metoda lub„QuerySelelect ()" metoda. Ten samouczek wyjaśnił procedurę uzyskania wartości elementu za pomocą JavaScript.