[html] <button> 에서 굳이 type에 button 을 적어주는 이유

 

<button>에서 type에 button을 명시하는 이유는 기본적으로 <button> 태그의 type 속성 값은 "submit"이다.

그래서 만약에 <button> 태그를 사용하면서 클릭 시에 submit이 실행되지 않기를 원한다면,

type="button"을 추가해주면 된다. ( type 을 구체적으로 명시하지 않으면 기본, type="submit" 으로 동작된다)

 

또한, form 태그에 속하지 않은 input에서 엔터키를 눌렀을 때, 이슈가 발생하는데,

이를 해결하기 위해서도 <button> 태그에서 type="button"을 명시해주는 것이 좋다. 

그러나, button 태그의 type 속성 값인 submit, reset, button은 input 태그의 type 속성으로도 사용할 수 있다.

그렇다면, <button> 태그를 사용하는 것보다 <input> 태그를 사용하는 것이 더 다양한 type을 제공하기 때문에 더 좋을 수 있다고 생각할 수 있지만, button 태그에는 <input> 태그에는 없는 기능들도 있다.

 

예를 들어, <button> 태그는 안에 HTML 코드를 넣을 수 있어서, 그 안에 이미지나 아이콘 등을 넣어서 버튼 디자인을 꾸밀 수 있지만, <input> 태그는 단순한 텍스트나 이미지만을 표시할 수 있기 때문에, 디자인적으로 제한이 있다.

결론적으로, <button> 태그에서 type="button"을 명시해주는 이유는 기본적으로 type 값이 "submit"이기 때문에, 클릭 시에 submit이 실행되지 않기를 원할 때 사용하며,  form 태그에 속하지 않은 input에서 엔터키 이슈를 해결하기 위해서도 사용된다. 하지만, <input> 태그를 사용하는 것이 더 다양한 type을 제공하기 때문에 더 좋을 수도 있지만, <button> 태그는 디자인적으로 다양한 기능을 제공하기 때문에, 상황에 따라 사용을 결정하면 된다.