더 나은 웹개발을 꿈꾸는 기술 블로그. 웹이즈프리.
총 17개의 일치하는 문서를 찾았습니다.
- js
자바스크립트를 사용하여 input 태그에 한글 입력 막기, 한글 불가 방법
다양한 글을 올리는 웹이즈프리입니다 ~ 이전 글들을 확인해보니 input 태그를 사용하는 경우 한글 입력을 막는 방법이 없더군요~ 이와 관련하여 input 사용시 한글 입력을 막는 방법과 효과적인 방법은 없는지 알아보았습니다."Input 태그 입력폼에서 한글 입력을 막으려면?"# input 태그에 한글 입력을 막는 방법제목은 한글 입력만을 막는 방법이지만 코드를 조금만 수정하면 input 태그에 원하는 텍스트만 입력하는 방법이 되겠습니다. 일단 한글이나 기타 특정 언어를 막는 경우는 언제일까요?@ 한글이나 기타 특정 텍스트 입력을 막는 경우는 언제일까?여러가지가 있...
Last Modified : 2021-12-13 20:24:46
Created : 2021-12-01 17:31:52 
js자바스크립트 FormData 데이터 전송 알아보기
자바스크립트에서 서버에 데이터를 전달해주는 API(인터페이스) FormData에 대하여 알아보겠습니다.! FormData는 무엇인가?자바스크립트를 사용하여 데이터를 서버에 보낼 수 있으며 Ajax 방식, 비동기식으로 데이터나 파일 모두 전송 가능하다는 점이 장점입니다. 최근 FormData가 많이 사용되는 이유는 비동기식 통신으로 <form></form> 태그를 직접 사용하지 않아도 되기 때문입니다.- key/value 방식으로 입력폼에 값을 쉽게 추가할 수 있음- AJAX 비동기으로 사용이 가능- 데이터 및 파일 전송이 가능# FormData ...
Last Modified : 2019-08-01 08:29:17
Created : 2019-06-27 11:00:29
htmlHTML form태그를 사용하여 입력폼 만들기 및 예제
HTML에서 입력폼을 만들때 사용하는 form 태그에 대하여 자세히 알아봅니다. 언제 그리고 어떻게 사용할까요?# form 태그 알아보기form 태그는 매우 자주 사용되는 중요한 태그인 만큼 하나하나 자세히 알아보도록 하겠습니다.! form 태그를 사용하는 경우는?먼저 form 태그의 기능은 웹페이지의 방문자에게 특정한 정보를 얻고 이를 서버에 전송할 수 있는 기능을 가지고 있습니다. 그래서 입력을 얻을 수 있는 input이나 textarea 등의 태그 요소를 내부의 자식요소로 가지게 되죠. 일반적으로 아래와 같은 모습입니다.<form> <...
Last Modified : 2019-08-22 09:32:51
Created : 2019-02-01 12:51:58- webdevetc
[실전] 검색창 UI 만들기
웹퍼블리싱 배우기. 이번에는 키워드를 찾아 검색할 수 있는 기능을 웹에 추가하기 위하여 검색창을 만드는 방법을 알아보겠습니다.# 검색창은 무엇이고 언제 사용되나요검색창은 방문자에게 원하는 웹사이트의 콘텐츠를 좀 더 찾기 쉽도록 도와주는 역할을 합니다. 예를 들어 css에 관련된 블로그 글을 찾는 경우 간단하게 검색창에 css를 타이핑하여 검색결과로 확인 및 이동하게됩니다. 아래에서는 검색창을 구현해보고 아래 사항도 고려하여 만들도록 하겠습니다.- 서버와 연동하기- 부트스트랩을 활용한 UI서버와 연동하는 경우 동기식, 비동기식 두가지가 존재합니다. 비동기식 ajax는 ...
Last Modified : 2019-08-05 22:15:34
Created : 2017-05-18 00:25:41 - etc
검색페이지 초성으로 검색하기 구현하는 방법
검색페이지 초성으로 검색하기 구현하는 방법...
Last Modified : 2017-05-01 21:02:51
Created : 2017-05-01 21:02:51 - etc
window.performance를 사용하여 메모리 성능 관리방법은?
window.performance 객체를 활용하는 방법은?...
Last Modified : 2017-09-21 00:21:28
Created : 2017-03-22 18:35:55 - etc
자바스크립트에서 성능향상 및 메모리를 위한 방법들은?
자바스크립트에서 성능향상을 위한 방법으로 무엇이 있을까요? 아래는 필요한 성능 개선 방법들을 요약한 것입니다.- 자바스크립트 엔진에서 마지막 위치를 찾지 않도록 모두 세미콜론(;)을 사용하여 종료할 것- 전역 변수를 피할 것- 메모리 leak를 피할 것- 자식노드의 교체시 메모리 문제 발생할 수 있음- 엘리먼트의 조작이 많은 경우 innerHTML을 사용하는 방법이 DOM 생성시 파싱되므로 더 효율적일 수 있음- 텍스트 노드에 대한 변경일 경우 innerHTML, outerHTML이 아닌 innerText, outerText를 사용할 것- DOM을 조회하는 코드는 가...
Last Modified : 2017-09-21 00:20:45
Created : 2017-03-22 16:54:04 
html폼태그에서 그룹화하는 fieldset 태그
웹사이트에는 다양한 정보를 한께번에 전달하기 위해 수 많은 입력폼이 존재할 수 있다. 예를 들어 회원가입 페이지만 하더라도 개인정보 및 동의 등등 입력해야하는 필드 수만 상당하다. 이런 경우 만약 이 폼들을 그룹화한다면 더욱 편리하게 관리할 수 있을 것이다. 이에 html에는 fieldset이라는 태그가 존재하며 이 태그를 사용할 경우 다수의 입력폼들을 그룹화하여 관리 및 콘트롤할 수 있다. 그럼 아래에서 좀 더 자세한 내용을 확인해보자.! fieldset 태그 알아보기fieldset 태그는 아래와 같은 몇 개의 속성들을 지정하여 사용할 수 있으며 각각의 속성들의 특...
Last Modified : 2016-07-01 12:23:29
Created : 2016-06-30 14:23:06- webdevetc
[CSS] transform 속성에 상대값 사용하여 요소 이동시 발생하는 여백 또는 선 제거하는 방법
세로 저ㅇ렬을 하거나 요소을 이동시키기 위해 다양한 방법이 사용가능하다~ 그중에서도 transform 속성을 사용하는 방법 역시 존재한다.! transform 속성을 이용한 요소의 이동아래와 같은 방법으로 우리는 transform을 사용해 이미지를 비롯한 다양한 요소를 원하는 곳으로 이동할 수 있다.<style>div {transform: translate(x,y);}</style>위 코드는 div 요소를 좌우 x, y 값만큼 이동시키는 방법이다. 이 방법은 요소를 이동시키는 다양한 방법들과 비교할 때 몇가지 이점이 있는데 그 이유가 무엇인지 알...
Last Modified : 2016-03-11 23:03:08
Created : 2016-03-09 15:52:26 
css[CSS] 요소 및 레이어 중앙 정렬시키는 가장 쉽고 간단한 방법
웹사이트에서 모달(Modal) 및 팝업창을 띄우거나 기타 특정 요소를 가로 또는 세로로 중앙 정렬하기 위한 방법은 몇 가지가 있다. 이때 해당 요소를 스크롤 및 브라우저 크기가 관계 없이 항상 고정된 위치에 중앙 정렬을 가지려면 어떤 방법이 가장 효과적일까...우선 요소를 중앙정렬 시키기는 일반적이면서 가장 간단한 방법으로 left 속성을 사용하며 우리는 아래와 같이 CSS를 사용해 이를 가능하게 할 수 있다.position: fixed;left: 50%;top: 50%;오른쪽(우측)으로 요소를 상대값 50% 만큼 이동시키면 해당하는 엘리...
Last Modified : 2019-08-18 15:48:06
Created : 2016-03-09 14:25:40