전체 글(32)
-
[Javascript 실습] 16장 마무리 문제
■ 1번 문제 : 결과 화면 처럼 현재 시각을 브라우저에 표시하는 프로그램을 작성하려고 한다. 조건을 참고하여 비어있는 코드를 채울것 1. 날짜, 시간 정보가 들어있는 Date 객체의 인스턴스를 만들어 변수로 저장 2. Date 객체의 메소드 중에서 지역 시간 정보를 알려 주는 메소드를 실행해서 currentTime 변수에 저장 현재 시각 ■ 2번 문제 : [현재 시간 보기] 버튼을 클릭하면 현재 시간이 있는 current.html 파일을 팝업 창으로 나타나게 하시오. 이 때 팝업창의 높이는 400px, 높이는 200px이고 브라우저의 중앙에 보이게 함. 1. 화면의 너빗값에서 팝업 창의 너빗값을 빼고 2로 나누면, 팝업창이 시작할 가로 좌표을 만들 수 있음 2. 마찬가지로 화면의 높잇값에서 팝업창의 높..
2024.03.12 -
[Javascript] 8. 브라우저와 관련된 객체2
- location 객체 : 브라우저의 주소 표시줄과 관련됨. 1. location 객체에는 현재 문서의 URL 주소 정보가 들어 있는데 이 정보를 편집하면 현재 브라우저 창에서 열어야 할 사이트나 문서를 지정할 수 있음. 2. location 객체의 프로퍼티와 메소드 프로퍼티 hash URL 중에서 #로 시작하는 해시 부분의 정보를 담고 있음 host URL의 호스트 이름과 포트 번호를 담고 있음 hostname URL의 호스트 이름이 저장됨 href 전체 URL이며 이 값을 변경하면 해당 주소로 이동할 수 있음 pathname URL 경로가 저장됨 port URL의 포트 번호를 담고 있음 protocol URL의 프로토콜을 저장함 password 도메인 이름 앞에 username과 password를 ..
2024.03.12 -
[Javascript] 7. 브라우저와 관련된 객체1
■ 브라우저와 관련된 객체 : 웹 브라우저에 문서가 표시되는 순간 브라우저는 HTML 소스를 읽으면서 화면에 내용을 표시하고 객체를 생성함 - window 객체 : 브라우저 창이 열릴 때마다 만들어짐. 브라우저 창 안의 요소 중에서 최상위 1. window 객체의 프로퍼티 document 브라우저 창에 표시된 웹 문서에 접근할 수 있음. frameElement 현재 창이 다른 요소 안에 포함되어 있을 경우 그 요소를 반환하고, 반대로 포함되어 있지 않으면 null을 반환함 innerHeight 내용 영역의 높이를 나타냄 innerWidth 내용 영역의 너비를 나타냄 localStorage 웹 브라우저에서 데이터를 저장하는 로컬 스토리지를 반환함 location window 객체의 위치 또는 현재 URL을..
2024.03.12 -
[Javascript] 6. 객체
■ 자바스크립트에서 객체란? 프로그램에서 인식할 수 있는 모든 대상을 지칭함. - 자바스크립트에서 사용하는 객체 문서 객체 모델(DOM) 웹 문서 자체도 객체이고 그 안에 삽입되어 있는 이미지와 링크, 텍스트 필드 등도 모두 객체임. 일반적으로 삽입하는 요소는 document, image, link 객체가 있음 브라우저 관련 객체 웹 브라우저에서 사용하는 정보도 객체로 나타날 수 있음. navigator, history, location, screen 등 내장 객체 자바스크립트 안에 미리 정의되어 있는 객체. 날짜와 시간과 과련된 Date 객체 - 객체의 인스턴스 만들기 : 자바스크립트의 객체는 참조 형태로 사용해야 함. 1. 기본형 : new 객체명 var now = new Date(); documne..
2024.03.11 -
[Javascript 실습] 15장 마무리문제
■ 1번 문제 : 두 수의 값이 같으면 곱하고, 다르면 더하는 sumMulti() 함수를 작성하시오 1. 함수 선언은 function sunMulti(x,y)로 한다. 2. if-else 문을 사용해 입력받은 두 수의 값을 비교한다. 3. 값을 비교할 때는 비교 연산자 '===' 사용 4. 콘솔 창에 표시할 때는 console.log()를 사용 var x = prompt("첫 번째 수를 입력하시오"); var y = prompt("두 번째 수를 입력하시오"); console.log(sumMulti(x,y)); function sumMulti(x,y){ if(x===y) return x*y; else return x+y; } ■ 2번 문제 : 프롬프트 창에서 두 수를 입력받아 크기를 서로 비교하여 더 큰 ..
2024.03.09 -
[Javascript] 5. 이벤트와 이벤트 처리기
■ 이벤트 : 웹 페이지를 읽어오거나 링크를 클릭하는 것처럼 웹 문서 영역 안에서 이루어지는 웹 브라우저나 사용자 동작을 의미함. - 마우스 이벤트 : 마우스를 이용해서 버튼이나 휠 버튼을 조작할 때 발생 click 사용자가 HTML 요소를 클릭할 때 이벤트 발생 dbclick 사용자가 HTML 요소를 더블클릭할 때 이벤트 발생 mousedown 사용자가 요소 위에서 마우스 버튼을 눌렀을 때 이벤트 발생 mousemove 사용자가 요소 위에서 마우스 포인터를 움직일 때 이벤트 발생 mouseover 마우스 포인터가 요소 위로 옮겨질 때 이벤트 발생 mouseout 마우스 포인터가 요소를 벗어날 때 이벤트 발생 mouseup 사용자가 요소 위에 놓인 마우스 버튼에서 손을 뗄 때 이벤트가 발생 - 키보드 이..
2024.03.09