본문 바로가기

Frontend145

JavaScript : 정규표현식이란? 정규표현식은 문자열에 나타나는 특정 문자 조합과 대응시키기 위해 사용되는 패턴이다. 정규표현식에서 패턴의 경우 단순 문자로 구성되기도 하지만, 특수문자를 사용하여 정규표현식을 구성하기도 한다. 정규표현식을 만드는 방법은 두가지가 있다. 정규식 리터럴 : /정규표현식/;정규식 리터럴은 스크립트가 불러와질 때 컴파일이 된다. RegExp 객체의 생성자 함수 호출 : new RegExp(정규표현식);생성자 함수를 사용하면 정규식이 실행되는 시점에서 컴파일이 되어, 정규식의 패턴이 변경될 수 있는 경우에는 생성자 함수를 사용한다. 정규표현식 패턴패턴설명.모든 문자열 (숫자, 한글, 영어, 특수기호, 공백 다 포함)a-zA-z영어 알파벳ㄱ-ㅎ가-힣한글 문자0-9숫자\s공백\S공백이 아닌 것\d숫자, [0-9]와 .. 2024. 7. 1.
HTML의 진행률을 알아보는 태그(<progress>, <meter>태그) 진행상태를 나타내는 태그는 태그와 태그가 있다. 태그의 경우 작업의 진행 상태를,  태그의 경우 알려진 범위 내의 값에서 얼마나 사용되었는지를 나타내는 태그이다. 예를 들어 태그는 진행률 표시를 하는데 사용하고, 태그의 경우 디스크 사용량, 투표율 등에 사용된다.  value의 경우 처음 로딩이 되었을 때의 상태를 설정할 수 있으며 max는 최대일 때의 수를 나타낸다.  작업진행률: 디스크(D): 2024. 7. 1.
HTML에서 버튼을 만들어보자 HTML 버튼은 사용자가 클릭할 수 있는 요소를 말한다. HTML에서는 버튼을 만드는 방법이 두 가지가 있는데 하나는 input type을 사용하는 방법이고, 다른 방법은 button태그를 사용하는 방법이다. HTML5부터 button태그가 추가되었으며, 웹 접근성이 중요해지면서 button 태그의 사용을 권장하고 있다. HTML4: HTML5 : 버튼이름버튼타입기능button아무 기능이 없는 버튼으로 자바스크립트 코드에서 이용된다.submit클릭하면 브라우저가 폼 데이터를 웹 서버로 전송한다.reset폼에 입력된 내용을 모두 지우고 초기화 하는 버튼이다.image이미지 버튼을 만든다.HTML5에서는 이미지 버튼을 만드는 방법으로는 이있다. .. 2024. 6. 30.
HTML에서 폼 요소를 사용해서 선택형 입력, 드롭다운 목록을 만들어보자 선택형 입력목록을 보여주고 목록에서 사용자가 선택하는 방식의 입력 요소다. radio" name="카테고리 이름" id="요소 이름" value="값">radio의 경우 여러 개의 목록 중 하나만 선택하고자 할 때 name을 통해서 항목끼리 묶어주면 된다. radio의 경우에는 name과 id가 다르다. value의 경우 입력하여 웹 서버에 전송될 때 보내지는 값을 의미한다.   checkbox의 경우 다중선택이 가능하며 name과 id를 같게 설정한다.  성별 남자 여자 좋아하는 과일을 선택하세요.(다중선택가능) 사과 포도 키위 수박 등록하기   드.. 2024. 6. 30.
HTML의 폼 요소를 사용해보자 텍스트 입력한 줄 텍스트를 입력 받을 때 사용한다.사용자가 입력하는 문자 대신 다른 글자를 출력하여 다른 사람이 볼 수 없게 한다. 여러 줄의 텍스트를 입력받을 때 사용한다.이메일, url, 전화번호, 검색키워드 등 형식 검사 기능을 가진 텍스트 입력 창으로, 디지털기기에서 브라우저를 불러올 때 유형을 인식하여 그에 맞는 권장사항을 보여준다. 예를 들면 tel 타입의 경우, 스마트폰에서 숫자만 있는 키보드가 켜지는 것을 볼 수 있다. 이메일의 경우 @를 포함하지 않으면 정보를 전송할 수 없으며, url의 경우 http://와 .com이 포함되어야 정보를 전송할 수 있다. search의 경우 활성화되면 자체적으로 reset버튼이 있어 reset이 가능하다. tel의 경우는 전화번호를 자유롭게 입력하도록 허.. 2024. 6. 30.
HTML 웹 페이지를 통해 사용자 입력을 받는 폼을 만들어 보자 HTML에서는 폼을 만들기 위한 다양한 태그들을 제공한다. 폼의 경우 로그인, 등록, 검색, 예약, 쇼핑 등의 다양한 웹 서비스에서 사용자의 입력을 받기 위해 사용된다.  태그 기본 형식name 속성은 폼의 이름을 지정하는 것으로 자바스크립트에서 사용되며, action속성은 폼 데이터를 처리할 목적지를 지정한다. method속성은 폼 데이터를 웹 서버로 전송하는 형식을 설정하는데 삭제(delete), 추가(post, put), 변경(patch), 색인(get) 등의 속성이 있으나 대표적인 방식은 get 과 post 이다. get의 경우 url의 마지막에 정보가 작성이 되며, 개방적이기 때문에 주의 해야한다. post의 경우에는 get보다 담을 수 있는 데이터 용량이 크다. post의 경우 무거운 파일을 .. 2024. 6. 29.