JavaScript & JQuery25 [JQuery&JavaScript] JQuery와 Javascript의 차이점 자바스크립트와 제이쿼리 자바스크립트는 웹브라우저에서 작동하는 스크립트입니다. 기능을 포함하는 거의 모든 홈페이지들이 사용하고 있습니다. 제이쿼리 또한 역시 자바스크립트입니다. 다만 자바스크립트로 빈번하게 사용되는 기능들은 조금 더 함축적인 코드를 통해 사용하게 만든 라이브러리입니다. 자바스크립트는 아래와 같이 크게 4가지 요소로 구성되어있습니다. 1. 자바스크립트 core 문법 2. 자바스크립트 core 라이브러리 3. 자바스크립트 BOM (Browser Object Model) 4. 자바스크립트 DOM (Document Object Model) 제이쿼리는 이중 자바스크립트 DOM 작업을 쉽게 처리할수있도록 도와주는 라이브러리입니다. 또한 제이쿼리는 DOM 작업을 쉽게 도와주는 라이브러리일 뿐, 자바스크.. 2022. 4. 18. [JavaScript]자주 사용하는 정규식 이메일 @앞쪽에 위치한 아이디 부분 문자 중 영문,숫자를 포함하여 점( . ), 하이픈( - ), 언더바( _ ) 까지 허용 var emailRule = /^([\w\.\_\-])*[a-zA-Z0-9]+([\w\.\_\-])*([a-zA-Z0-9])+([\w\.\_\-])+@([a-zA-Z0-9]+\.)+[a-zA-Z0-9]{2,8}$/i; ! @ # $ % ^ & - _ . 까지 허용한 정규식 var emailRule = /^[!@#$%^&-_\.]*[0-9a-zA-Z]+[!@#$%^&-_\.]*@[0-9a-zA-Z]([-_\.]?[0-9a-zA-Z])*\.[a-zA-Z]{2,3}$/i; 비밀번호 특수문자, 문자, 숫자 포함 형태의 8~15자리 이내의 암호 정규식 var pwRule = /^.*(?=^.. 2022. 4. 12. [JavaScript] 정규 표현식(RegExp)의 개념 정규 표현식이란? 정규 표현식이란 regular expression를 줄여 RegExp라고 불리며, 특정한 '패턴'을 가진 '문자열'의 '집합'을 표현하기 위해 사용하는 '형식 언어(formal language)'를 말합니다. 쉽게 말해, 정규 표현식은 문자열에서 특정한 규칙을 가지는 문자열의 집합을 찾아내기 위한 검색 패턴이라고 말할수있습니다. 정규 표현식은 자바스크립트의 고유 문법이 아니며, 대부분의 프로그램 언어와 코드 에디터에 내장되어 있으며, 자바스크립트는 정규 표현식 문법을 ES3부터 도입하였습니다. 정규 표현식을 사용하면, 복잡한 조건문이 아닌 한 줄로 간단히 표시할 수 있습니다. 정규 표현식의 역할 정규 표현식은 문자열을 대상으로 '패턴 매칭 기능'을 제공합니다. 패턴 매칭 기능이란 특정 .. 2022. 4. 12. [JavaScript]checkbox, select, radio 활성화, 비활성화 / 선택 값 / 선택 변경 개발을 하다 보면 자주 사용하지만 할 때마다 찾아보는 것들이 있습니다. 대부분이 자바스크립트 부분인데 이번 포스팅은 그중 체크박스 , 셀렉트, 라디오 버튼 제어에 대한 글입니다. 체크 박스 CHECKBOX 1. 체크 여부 - 다음과 같은 형식으로 코드를 사용합니다. - 아이디를 사용할 경우 ("input:checkbox[id='체크박스의 아이디']").is(":checked") - 네임을 사용할 경우 ("input:checkbox[name='체크박스의 네임']").is(":checked") var chkYnById = ("input:checkbox[id='playerChkBox1']").is(":checked"); var chkYnByName = ("input:checkbox[name='playerChk.. 2022. 3. 22. [JavaScript] JavaScript 란? HTML과 CSS는 정적인 언어입니다. 정적이라는 것은 이것들이 브라우저를 통하여 웹페이지를 화면에 그려주면 이 화면을 변경할 수 있는 방법이 없다는 의미입니다. 하지만 Javascript는 HTML과 CSS로 만들어진 웹 페이지를 동적으로 변경해줄수 있는 언어입니다. 알러트창(알림창)을 띄우고 탭 인터페이스를 만들고, Drag & Drop 기능의 웹 애플리케이션을 만들 수 있습니다. 1. 역사 첫 탄생은 1995년 넷스케이프에서 근무하던 브랜든 아이크가 10일 만에 설계한 것으로부터 시작됩니다. 처음에는 Mocha라는 이름이었지만 4달 만에 LiveScript라는 이름으로 개명하고 다시 3달 후에는 JavaScript라는 이름이 되어 오늘날까지 이어지고 있습니다. 'JAVA와 구문이 유사하여 이름을 J.. 2022. 3. 21. [HTML&JSP] SNS에서 URL 공유시 미리보기meta 태그 링크를 SNS를 통하여 URL을 공유할 때 링크 상단에 썸네일, 타이틀, 설명 등 다양한 정보가 노출됩니다. 어떠한 정보들이 노출되며, 어떻게 설정을 할 수 있는지 확인해보고자 합니다. 아래와 같이 카카오톡이나 다른 SNS에서 URL을 공유할 때 메타태그에 있는 오픈그래프 정보를 이용하여 사용자에게 노출하게 됩니다. 노출된 정보는 아래와 같이 카카오톡에서 보이게 되는 미리 보기 기능을 하게 됩니다. 오픈그래프(오픈그래프 프로토콜, Open Grapg, OG)란? 어떠한 HTML 문서의 메타정보를 쉽게 표시하기 위해서 메타정보에 해당하는 제목, 설명, 타입, 대표 URL 등 다양한 요소들에 대하여 사람들이 통일하여 사용할 수 있도록 정의한 프로토콜입니다. 페이스북에 의하여 기존의 다양한 메타 데이터 표.. 2022. 3. 17. [WEB] meta태그 HTML의 meta 태그 -문서에 대한 메타데이터(metadata)를 정의하는 요소 1. meta 태그란? 태그는 웹페이지의 보이지 않는 정보를 제공하는데 사용되는 태그입니다. 해당 문서에 대한 정보인 메타데이터(metadata)를 정의하여 사용됩니다. 태그를 통하여 페이지의 설명 요약, 핵심 키워드, 제작자, 크롤링 정책 등 수많은 정보를 제공할 수 있습니다. SEO(Search Engine Optimization의 약자, 검색 엔진 최적화)를 위해 사용됩니다. 2. meta 태그 확인하기 위 이미지는 티스토리의 메타태그 정보를 나타내는 이미지입니다. 크롬 브라우저 기준으로 키보드의 f12를 누르거나, 화면에서 마우스 오른쪽 버튼을 클릭하여 검사 항목을 선택하여 그림1 과 같은 정보를 확인할 수 있습니.. 2021. 7. 21. 이전 1 2 3 다음 반응형
