목록분류 전체보기 (249)
고래씌
■ 모든 html에 아래와 같은 style 적용 1. 탐색(순회) 메소드 - 조상 순회 메소드 : 기준이 되는 요소의 상위요소들을 선택할 수 있는 메소드 - $("선택자").parent() : 선택된 요소의 바로 위 상위요소 하나만을 선택 - $("선택자").parents() : 선택된 요소의 모든 상위요소 다 선택 - $("선택자").parents("선택자") : 선택된 요소의 모든 상위요소들 중에서 제시한 값과 일치하는 상위요소들만 선택 - $("선택자").parentsUntil("선택자") // until : ~ 까지 : 선택된 요소부터 제시한 값까지의 모든 상위요소들을 선택 조상 div(증조할머니) ul(할머니) li(엄마) span 나 div(할아버지) p 아빠 span 동생 => 기본화면 ▶ ..
1. 필터 관련 선택자 이름 혈액형 거주지 홍길동 B형 서울 이고래 B형 서울 이순신 A형 경기 총 인원 3명 ▶ $("tr:first").css("background","black").css("color","white"); == $("tr:first-of-type").css("background","black").css("color","white"); ☞ tr태그 중 첫번째 요소 ☞ css 에서는 first-of-type이었는데 ... ☞ jQuery에서는 first로 바뀐다! 2. 필터링과 관련된 메소드 - 기준이 되는 요소중에서 특정 요소만을 걸러서 선택해주는 메소드 - first(), last(), filter(), eq(), not() test-1 test-2 test-3 test-4 test-..
1. 자손선택자(>) , 후손선택자 () 자손1 div의 후손이면서 ul의 자손1 div의 후손이면서 ul의 자손2 div의 후손이면서 ul의 자손3 div의 후손이면서 ul의 자손4 div/ul의 후손이면서 li의 자손 자손2 자손3 ▶ div 태그의 자식중 h3만 선택하기 $(function(){ $("div>h3").css("color","lightblue"); }) ▶ div 태그의 후손중 h3만 선택하기 $(function(){ // div태그의 후손중 h3만 선택하기 $("div h3").css("backgroundColor",'violet'); // ⓐ $("div li>h3").css("backgroundColor",'red'); // ⓑ // div>ul>li>h3 == div ul h3..
1. 아이디 선택자 : 특정 고유한 아이디값을 가진 요소 하나만을 선택하고자 할 때 ID1 ID2 ▶ jQuery 방식으로 아이디 요소 선택 => $("#아이디명") ex) ☞ .html() : 선택된 요소의 innerHTML과 관련된 기능을 수행 ☞ "h2변경"으로 값이 변경되어 출력됨 2. 태그 선택자 JAVA oracle jdbc html css javascript ▶ jQuery 방식 => ${'태그명'}.css(); ▶ 여러 종류의 태그들을 동시에 선택하고자 할 때 ${'태그명','태그명'}.css(); 3. 클래스 선택자 : 특정한 클래스 속성들을 가진 요소들을 선택하고자 할 때 사용 Class1 Class2 Class3 ▶ jquery 방식 $(".select") .css("backgroun..
1. jQuery 란? - 기존에 자바스크립트 언어만으로 구현하기에 복잡했던 구문 작성들을 간소화하기 위해 "존 레식"에 의해 개발된 JavaScript기반의 라이브러리(유용한 기능들의 모음집) - 즉, JavaScript언어로 유용한 함수나, 내용들이 이미 만들어져있는 모음집 - 복잡한 자바스크립트 구문을 보다 짧고 쉽게 개발 가능(적은 양의 코드로 빠르고, 풍부한 기능 제공) ▶ jQuery 장점 0) 국내에서 많은 회사들이 사용하고 있다. 1) DOM 요소와 관련된 스크립트를 보다 쉽게 구현할 수 있다 2) AJAX(비동기 통신), 이벤트 처리 등 다양한 기능들을 폭 넓게 지원한다 3) jQuery기반의 확장형 플러그인, 오픈 API 등으 지원한다 (차트, 슬라이드, 애니메이션 등등..) 2. jQ..
* 아이디 : 첫글자는 반드시 영문자로, 그리고 영문자, 숫자를 포함하여 총 4~12글자 입력하시오 * 비밀번호 : 영문자, 숫자, 특수문자(!@#$%^) 총 8~15글자로 입력하시오. * 비밀번호 확인 : 위의 비밀번호와 일치하게 입력하시오. * 이름 : 한글로만 작성해야하며 2글자 이상으로 입력하시오 * 이메일 : 이메일 형식에 맞춰서 입력하시오 * 취미 : 축구 야구 농구 독서 * 거주지 : 선택안함 서울 부산 경기 인천
1. 정규식 - 정규표현식(REGEX / REGEXP : Reqular Expression) 이란, 특정패턴을 가진 문자열을 찾거나 또는 찾아서 변경할 때 사용하는 형식 언어 - 정규표현식을 이용하면 문자열에 대해 특정패턴 조건 검사 시 또는 치환시 복잡한 조건을 제시할 필요없이 간단하게 처리 가능하다. - 자바스크립트뿐만 아니라 자바나 오라클등 다른언어에서도 사용가능 1) 정규표현식 객체 생성 및 정규식과 관련한 메소드 ▶ 정규표현식 객체 생성 == 정규식 년수를 선언 == 검색조건으로 삼고자하는 문자열이나 패턴을 제시해야함 ▶ 정규식 객체 생성 const regExp = /script/; // 정규식 객체 단축생성 구문 const regExp2 = new RegExp("script") // 정규식 객..
Practice4 구매 정보 구매자 : 상품명 : 가격 : 구매 수량 : 납품 등급 : 기타 사항 : 입력 값 출력하기 Practice5 검색할 항목을 선택하세요. 제목 날짜 작성자 검색할 제목을 입력하세요 : 검색 검색할 날짜를 선택하세요 : 검색 검색할 작성자를 입력하세요 : 검색
1. 이벤트 모델 종류 1) 고전 이벤트 모델(기본 이벤트 모델) - 요소 객체를 가지고 와서 해당 요소 객체에 이벤트 속성에 접근한 후 이벤트 핸들러를 연결하는 방식 - 이벤트를 제거할 수도 있음 ■ 요소 내부에 인라인으로 이벤트 속성을 기술하지 않음 확인 확인 => 2번째 확인을 누른 결과, 1번째 확인 버튼을 클릭하여도 생성이 되지 않는 것을 볼 수 있음 2) 인라인 이벤트 모델 - 요소 내부에 직접적으로 이벤트 속성을 제시해서 실행할 내용을 정의하는 방식. - 주로 script 태그 내에 정의되어있는 함수를 호출하는 방식을 선호 확인 확인 3) 표준 이벤트 모델(addEventListener) ▶ addEventListeenr : 이벤트 추가 ▶ removeEventListener : 이벤트 삭제..
1. windows용 객체 : window 객체는 자바스크립트의 최상위 객체이며 크게 BOM과 DOM으로 나눔 - BOM(Browser Object Model) : location, history, screen, navigator... - DOM(Document Object Model) : document 1) window.open('url', '창이름', '특성') ▶ window.open('url', '창이름', '특성') - 첫번째 인자값 : 새 창에서 열고자 하는 url 주소 - 두번째 인자값 : 창 이름, 창이름이 같은게 이미 열려있을 경우, 새로 열리지 않고 이미 열려있는 창에서 새로고침이 된다. - 세번째 인자값 : 창의 특성, 새로 열릴창의 너비, 높이, 툴바, 스크롤바, 리사이즈여부 등등..