티스토리

컴퓨터용 싸인펜

검색하기

블로그 홈

컴퓨터용 싸인펜

ryan0102.tistory.com/m

Ryannn 님의 블로그입니다.

구독자: 0

방명록 방문하기

주요 글 목록

12. 웹 워커 1. 1부터 10까지 더하는 워크 태스크 만들기 1~10까지 더하는 워크 태스크 만들기 let sum=0; for(let i=1;i 공감수 0 댓글수 0 2022. 4. 8.
11. 쿠키, 웹 스토리지 1. 몇 번째 방문인지 안내하기 2. 구입 리스트 저장/검색 - 세션 스토리지 세션 스토리지에 구입 리스트 저장/검색 품목명 : 개수 : 저장검색 3. 이름과 학번 저장/검색- 세션 스토리지 이름과 학번 입력 이름 학번 스토리지에 저장 이름으로 학번 검색 페이지로 이름과 학번 검색 이름 학번 스토리지에서 검색 이름으로 학번 저장 페이지로 4. 포스트잇 입력/출력 - 로컬 스토리지 포스트잇 제목 메모입력 저장 보기 포스트잇 출력 5. 일기 저장하기 - 로컬 스토리지 일기 쓰기 저장보기 일기 보기 공감수 0 댓글수 0 2022. 4. 8.
10. 캔버스 그래픽 1. 삼각형 그리기 선으로 삼각형 그리기 2. 원호 그리기 원호 그리기 3. 사각형 색 채우기 채운 사각형과 원호 그리기 4. 캔버스에 이미지 그리기 5. 그림판 구현하기(색 고정) 6. 오륜기 그리기 오륜기 그리기 7. 폼으로 사각형 그리기 폼으로 사각형 그리기 xy widthheight 선굵기 그리기지우기 8. mousedown과 mouseup으로 선 그리기 mousedown과 mouseup으로 선 그리기 9. 파이 차트 그리기 학점 별로 학생 수를 입력하면 파이 차트로 비율 그리기 A명B명C명 D명F명차트 그리기 공감수 0 댓글수 0 2022. 4. 8.
9. Window 객체 (2) 1. navigator 객체 프로퍼티 나열 브라우저에 관한 정보 출력 아래에 이 브라우저에 관한 여러 정보를 출력합니다. 2. history 객체 활용 history 객체 활용 back() go(-1)() forward() 3. 구글 chrome 브라우저 감별기 - navigator 객체 활용 구글 chrome 브라우저 감별 4. 해상도 경고 메시지 출력 - screen 객체 활용 screen 객체 활용 안녕하세요오오오 공감수 0 댓글수 0 2022. 4. 8.
8. Window 객체 1. 윈도우 열기 - window.open() window.open()으로 윈도우 열기 엘비스프레슬리 유니버설 올랜도 디즈니월드 홈페이지 2. 윈도우 닫기 - window.close() window의 close()로 윈도우 닫기 새 윈도우 현재윈도우 닫기 새윈도우 닫기 3. 5초 후 링크 접속 - window 타이머 활용 이미지에 마우스를 올리고 5초간 그대로 있을 때 사이트로 이동합니다. 4. 텍스트 자동회전 텍스트가 자동 회전하며, 마우스로 클릭하면 중단합니다. 회전하는 텍스트입니다. 자동 5. 윈도우 크기 조절 - window.moveBy(), window.resizeBy() 윈도우의 위치와 크기 조절 leftright updown +- 6. 윈도우 자동 스크롤 - window.scrollBy() .. 공감수 0 댓글수 0 2022. 4. 8.
7. 이벤트 객체(2) - 문서, 이미지 로딩 / 폼 이벤트 1. 로딩되면 경고문 출력 안녕! 2. 이미지 로딩 후 크기 출력 onload로 이미지 크기 출력 바나나 사과 망고 이미지 크기 3. new Image()로 이미지 로딩 new Image()로 이미지 로딩 이미지를 클릭하면 다음 이미지를 보여줍니다. 4. 이름 입력 후 다음 폼으로 이동 가능한 폼 만들기 - onblur, onfocus 활용 onfocus와 onblur 이름을 입력하지 않고 다른 창으로 이동할 수 없습니다. 이름 학번 5. 클릭되면 라디오 버튼의 value 출력 - checked 프로퍼티 활용 버튼을 클릭하면 선택된 라디오 버튼의 value를 출력합니다. 서울 부산 춘천 6. 자동 물품 계산기 - checked 프로퍼티 활용 물품을 선택하면 금액이 자동 계산됩니다. 모자 1만원 구두 3만.. 공감수 0 댓글수 0 2022. 4. 8.
6. 이벤트 객체 (1) - 마우스 핸들링 1. 마우스 올리면 경고문 출력 - onmouseover() 이곳에 마우스를 올려 보세요 클릭하세요 2. 이벤트 객체 프로퍼티 출력 이벤트 객체의 프로퍼티 출력 버튼을 클릭하면 이벤트 객체를 출력합니다. 클릭하세요 3. 링크 이동 - preventDefault() 활용 이벤트의 디폴트 행동 취소 네이버로 이동할 지 물어보는 링크 빵(체크 됨); 술(체크 안됨); 4. 계산기 onclick, 계산기 만들기 계산하고자 하는 수식을 입력하고 계산 버튼을 눌러봐요. 식 값 5. CSS 속성 동적 변경 - 마우스 관련 이벤트 리스너 활용 마우스 관련 이벤트 리스너 마우스 관련 이벤트가 발생합니다. 6. 마우스 좌표 출력 마우스 이벤트 객체의 프로퍼티와 onmousemove 이미지 위에 마우스를 움직일 때 onmo.. 공감수 0 댓글수 0 2022. 4. 8.
5. DOM / document 객체 1. CSS스타일 동적 변경 - getElementById 활용 CSS스타일 동적 변경 이것은 문장입니다. 2. CSS스타일 동적 변경 - innerHTML 활용 CSS스타일 동적 변경 이것은 문장입니다. 3. 버튼 만들기 - onclick(), this 활용 버튼 활용 4. document의 주요 프로퍼티 활용 document의 주요 프로퍼티 네이버 홈페이지 이곳은 div 영역입니다. 5. 하이라이트 - getElementsByTagNames 활용 내가 좋아하는 과일 저는 빨간 사과를 좋아해서 아침마다 한 개씩 먹고 있어요. 운동할 때는 중간 중간에 바나나를 먹지요. 탄수화물 섭취가 빨라 힘이 납니다. 또한 달콤한 향기를 품은 체리와 여름 냄새 물씬 나는 자두를 좋아합니다. 6. 하이라이트 - getE.. 공감수 0 댓글수 0 2022. 4. 8.
4. 배열과 객체 1. 코어 객체 활용하기 - Date(), String() 객체 생성 및 활용 2. []로 배열 만들기 []로 배열 만들기 3. 평균 온도 출력 - Array 객체로 배열 만들기 Array 객체로 배열 만들기 4. Array 객체의 메소드 활용 Array 객체의 메소드 활용 5. Date() 객체로 현재 시간 알아내기 Date객체로 현재 시간 알아내기 6. 방문 시간에 따라 변하는 배경색 - Date()객체 활용 페이지 방문 초시간이 짝수이면 violet, 홀수이면 lightskyblue 배경 7. String() 객체의 메소드 활용 string 객체의 메소드 활용 8. 구구단 계산 - Math 활용 Math를 활용한 구구단 연습 9. 사용자 객체 만들기 - new Object() 활용 new Objec.. 공감수 0 댓글수 0 2022. 4. 8.
3. 함수 1. 더하기 역할의 함수 만들기 함수 adder() 2. javascript의 전역함수 (eval(), parseInt(), isNaN()) 사용하기 eval(), parseInt(), isNaN() 3. 구구단 출력 함수 구현 구구단 출력 함수 만들기 4. 가장 큰 자리수와 가장 낮은 자리수 같은지 비교 큰 자리수와 낮은 자리수 같은지 비교 5. eval()로 수식 계산하기 6. 별 문자 출력하기 별 문자 출력하기 공감수 0 댓글수 0 2022. 4. 8.
2. 조건문 / 반복문 1. 학점 매기기 - if-else if-else를 이용한 학점 매기기 2. 커피 주문하기 - switch switch 문으로 커피주문 3. 다양한 크기의 글씨 출력 - for for 문으로 10px~35px 크기 출력 4. 0~n까지의 합 구하기 - while while 문으로 0에서 n까지 합 5. 1에서 얼마까지 더해야 3000을 넘는가 확인 - break 1에서 얼마까지 더해야 3000을 넘는가? 6. 3으로 나눈 수가 1인 수만 더하기 3으로 나눈 나머지가 1인 수만 더하기 7. 출근 요일 출력하기 - switch 월화수목금토일 8. 암호 입력 - do-while, break 암호를 입력하라 공감수 0 댓글수 0 2022. 4. 8.
1. 데이터 타입과 변수 / 연산 1. 변수 선언 변수 선언, 전역/지역/블록 변수 2. 리터럴 선언 리터럴 3. 산술 연산 산술 연산 4. 대입 연산 대입 연산 5. 비교 연산 비교 연산 6. 논리 연산 논리 연산 7. 조건 연산 조건 연산 공감수 0 댓글수 0 2022. 4. 8.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.