개발자는 대부분 웹 페이지가 매력적이며 대화형으로 만들기를 원합니다. 이를 위해 웹 페이지에 버튼이 추가됩니다. 예를 들어, 계정에 등록하거나 로그인하는 동안 사용자를 위한 추가 기능에 대한 클릭 이벤트를 포함하여 데이터를 보내거나 받아야 하는 경우. 이러한 경우 버튼을 통해 최종 사용자는 다양한 기능을 스마트하게 수행할 수 있습니다.
이 블로그에서는 JavaScript에서 버튼을 만드는 방법을 설명합니다.
JavaScript에서 버튼을 만드는 방법은 무엇입니까?
JavaScript에서 버튼을 생성하려면 다음 방법을 사용할 수 있습니다.
다음 접근 방식은 개념을 하나씩 보여줍니다!
방법 1: 'createElement()' 및 'appendChild()' 메서드를 사용하여 JavaScript에서 버튼 만들기
' 생성 요소() ' 메소드는 요소를 생성하고 ' 추가자식() ” 메소드는 요소의 마지막 자식에 요소를 추가합니다. 버튼을 생성하고 이를 활용해야 하는 DOM(Document Object Model)에 추가하는 방법은 각각 적용됩니다.
통사론
문서. 요소 생성 ( 유형 )요소. 추가자식 ( 마디 )
위 구문에서 ' 유형 '는 createElement() 메소드를 사용하여 생성될 요소의 유형을 참조하고 ' 마디 '는 appendChild() 메서드의 도움으로 추가될 노드입니다.
다음 예에서는 명시된 개념을 설명합니다.
예시
먼저 ' 단추 '는 document.createElement() 메서드를 사용하여 생성되고 ' 생성 버튼 ':
상수 생성 버튼 = 문서. 요소 생성 ( '단추' )다음으로 ' 내부텍스트 ” 속성은 생성된 버튼을 참조하여 지정된 버튼의 텍스트 값을 다음과 같이 설정합니다.
생성 버튼. 내부텍스트 = '클릭 해주세요'마지막으로 ' 추가자식() ” 메소드는 생성된 버튼이 인자로 저장된 변수를 참조하여 DOM에 추가합니다:
문서. 신체 . 추가자식 ( 생성 버튼 ) ;위 구현의 결과는 다음과 같습니다.
방법 2: 'input' 태그의 'Type' 속성을 사용하여 JavaScript에서 버튼 생성
' 유형 ” 속성은 표시할 입력 요소의 유형을 나타냅니다. '를 지정하여 버튼을 만드는 데 사용할 수 있습니다. 단추 '를 입력 태그의 유형 속성 값으로 사용합니다.
통사론
< 입력 유형 = '단추' >여기, ' 단추 '는 입력 필드의 유형을 나타냅니다.
아래 주어진 예를 확인하십시오.
예시
먼저 입력 태그를 사용하고 해당 유형을 ' 단추 ', 값은 ' 클릭 해주세요 '. 결과적으로 버튼이 생성됩니다. 또한 ' 생성 버튼() ' 클릭 시 기능:
< 입력 유형 = 버튼 값 = Click_Me onclick = '만들기 버튼()' >JavaScript 파일에서 ' 생성 버튼() '추가된 버튼을 클릭할 때 경고 상자를 생성하는 기능:
기능 생성 버튼 ( ) {알리다 ( '이것은 버튼입니다' )
}
산출
JavaScript에서 버튼을 생성하기 위해 논의된 기술은 요구 사항에 따라 적절하게 활용될 수 있습니다.
결론
JavaScript에서 버튼을 생성하려면 ' 생성 요소() ' 그리고 ' 추가자식() ” 메서드는 버튼을 생성하고 DOM에서 활용하기 위해 추가하는 데 적용할 수 있습니다. 버튼을 만드는 데 사용할 수 있는 또 다른 기술은 입력 유형을 정의하고 관련 기능을 추가하는 것입니다. 이 기사에서는 JavaScript에서 버튼을 만드는 방법을 보여주었습니다.