JavaScript에서 입력 텍스트 필드의 값을 어떻게 얻나요?

JavaScript에서 입력 텍스트 필드 값 가져오기

질의에 대한 응답으로 양식을 사용하지 않고 직접 입력 텍스트 필드의 값을 검색할 수 있는 여러 가지 방법이 있습니다.

방법 1: 사용 getElementById()

document.getElementById('textbox_id').value는 원하는 텍스트 입력 필드의 값을 직접 검색합니다.

document.getElementById("searchTxt").value; // Get the value of the searchTxt text field

방법 2: 사용 getElementsByClassName()

document.getElementsByClassName('class_name')[whole_number].value는 라이브 HTMLCollection을 반환하고 클래스에 따라 원하는 텍스트 필드를 선택하는 데 사용할 수 있습니다.

document.getElementsByClassName("searchField")[0].value; // Get the value of the first text field with class "searchField"

방법 3: 사용 getElementsByTagName()

document.getElementsByTagName('input')[whole_number].value도 라이브 HTMLCollection을 반환하고 태그 이름에 따라 원하는 텍스트 필드를 선택할 수 있습니다.

document.getElementsByTagName("input")[0].value; // Get the value of the first text input field

방법 4: 사용 getElementsByName()

document.getElementsByName('name')[whole_number].value는 라이브 NodeList를 반환하고 이름 속성을 기반으로 원하는 텍스트 필드를 선택하는 데 사용할 수 있습니다.

document.getElementsByName("searchTxt")[0].value; // Get the value of the first text field with name "searchTxt"

방법 5: 사용 querySelector()

document.querySelector('selector').value는 CSS 선택기를 사용하여 원하는 텍스트 필드를 선택합니다.

document.querySelector('#searchTxt').value; // Get the value of the text field with id "searchTxt"

방법 6: 사용 querySelectorAll()

document.querySelectorAll('selector')[whole_number].value도 CSS 선택기를 사용하여 원하는 텍스트 필드를 선택하지만 정적 NodeList를 반환합니다.

document.querySelectorAll('.searchField')[0].value; // Get the value of the first text field with class "searchField"

아래 표는 이러한 방법에 대한 브라우저 호환성 정보를 제공합니다.

위 내용은 JavaScript에서 입력 텍스트 필드의 값을 어떻게 얻나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!