ksmart_html_css_js/JavaScript(33)
-
HTML요소(on속성)이벤트_js
- 모든 태그에는 접두사 on이 붙은 속성이 있다. - 접두사 on 속성은 자바스크립트와 연계된다. - 접두사 on 속성은 사용자의 행위에 관련된 속성이다. 자주 쓰이는 이벤트 - 사용자가 클릭 했을 때 버튼 난 버튼이 아닌데 버튼 버튼 버튼 change - 사용자의 행위에 의해 값이 변경되었을 시 ::값 선택:: 1 2 3 onblur - 커서 활성화가 없어졌을 때 onkeyup, onkeydown, onkeypress - onkeyup : 키를 눌렀다가 뗐을 경우 - onkeydown : 키를 눌렀을 경우 - onkeypress : 키를 누르고 있을 경우
2022.01.30 -
02. 브라우저 객체 모델_js
alert - 사용자에게 경고장 인수에 삽입된 문자열 혹은 숫자형 데이터를 출력 confirm - 진행여부 확인 - 결과값은 확인 true 취소는 false setTimeout, clearTimeout - 정해진 시간 이후에 실행 - setTimeout : 정해진 시간 이후에 1회 실행 - clearTimeout : 정해진 시간 이전에 실행 취소 setInterval, clearInterval - setInterval : 정해진 시간 간격으로 실행 - clearInterval : 실행 중단 location - 현재 페이지 url 정보 - 새로고침 및 다른 페이지 이동 시 사용 - 새로고침 -> reload(), 페이지 이동 -> location.href='이동경로'; - 페이지 이동 location..
2022.01.30 -
01. 브라우저 객체 모델_js
- 최상위 window 객체가 있다 open, close - open : 새 창, close : 창 닫기 popup.html 팝업입니다. 경로,타이틀,옵션 window.open('popup.html','팝업띄우기','width=300,height=400,left=100,top=100,scroppbar=no'); 이벤트와 연계 - 인수에 들어간 선택자와 일치하는 대상을 찾기 팝업열기 - onclick시 아래 함수 실행 팝업열기 팝업 열기, 닫기 function popupOpen(){ window.open('popup.html','팝업띄우기', 'width=300,height=400,left=100,top=100,scroppbar=no'); } 팝업입니다. 팝업닫기 cookie로 오늘 하루 팝업 안뜨게 하는..
2022.01.30 -
this, 내장객체_js
this 키워드 - 객체화된 객체의 자신 상위의 this를 출력하고 싶을 때는 상위에서 변수를 선언해주면 된다. var parentObj = this; parentObj.objName = '홍길동'; 내장객체 - 브라우저에 내장된 객체(내장된 생성자 함수) - new 연산자를 활용하여 객체화 - 구문 : 참조변수 = new 내장객체명(); 내장객체 - 날짜 - 프론트 단에서 날짜 관련 작업이 필요 할 경우 - 구문 : 참조변수 = new Date(); - 날짜 객체 - 내가 원하는 날짜 기준으로 날짜 객체화 시키기 var date2= new Date('2021-10-10'); console.log(date2); 내장객체 - 배열 join(연결 문자) 배열 객체의 데이터를 연결 문자 기준으로 1개의 문..
2022.01.30 -
객체 생성자 함수 프로토타입_js
객체 생성자 함수 프로토타입 1. 프로토타입 : 원형 -> 객체 생성자 함수 정의(선언)한 대상 2. 원형에 추가로 메서드 및 속성을 추가 할 수 있다. (원형에서 this 키워드로 속성이나 메서드를 추가하지 않고 (원형을 건들지 않고) 메서드나 속성을 추가 할 수 있다.) 3. 객체화된 대상에서 프로토타입으로 추가된 메서드나 속성을 사용할 수 있다.(객체화된 대상 기준으로 프로토타입으로 확장(상속)) 4. 정의된 객체생성자 함수 기준으로 객체화가 되며, 프로토타입으로 선언된 속성이나 메서드는 객체화된 대상에 내용은 포함하고 있지않다. 허나 사용은 가능하며, 이를 프로토타입에 명시된 속성이나 메서드를 확장했다고 표현할 수 있다. 5.구문 : 함수명.prototype.함수명이나 속성명 = 값; UserIn..
2022.01.30 -
객체생성자함수_js
객체 생성자 함수 - 함수를 new 연산자를 통하여 객체화 시키는 것 - var, let 으로 내부에 변수나 내부함수 선언시 외부에서 접근 불가능 - this 키워드로 내부 변수나 내부 함수(메서드) 선언 시 외부에서 접근 가능 - 함수 선언 후 new 연산자 활용해보기 function MyFn(){ } //함수에 new 연산자가 붙을 경우 객체화가 된다. console.log(new MyFn()); - 함수 내부에서 this 키워드 활용해보기 function MyFn2(){ this.userName; } var obj={}; obj.userName='홍길동'; console.log(obj); function MyFn2(){ this.userName='홍길동'; } console.log(new MyFn2..
2022.01.30