*자바스크립트
1. 자바스크립트 객체의 개념을 알고 활용할 수 있다.
2. 중첩객체와 내장객체 중 math와 date를 알 수 있다.
3. 전자시계를 만들있다.
- 기능이 유사한 것들 모아둔 집합체
- 객체의 구성: 속성, 메소드
- 하나의 배열에 복합 데이터를 저장
- 객체는 키와 값의 쌍으로 복합 정보를 저장
- 객체 저장 형식
- 객체의 한 키/값 쌍을 프로퍼티라고 함
| 자바스크립트 함수 (0) | 2022.05.19 |
|---|---|
| 자바스크립트 조건문 (0) | 2022.05.19 |
| 자바스크립트, 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) (0) | 2022.04.26 |
| 자바스크립트 DOM & Event (0) | 2022.04.26 |
| 자바스크립트 문서 객체 모델(DOM) (0) | 2022.04.25 |
****************
FORM 태그
****************
Form태그란?
- 사용자로부터 어떠한 정보를 받고 싶을 때 사용
- 숙박부, 주문양식, 설문조사, 피드백 등을 위해 활용될 수 있음
Form tag의 양식
<form> : form의 시작을 알리는 tag
<input> : 다양한 방법 중 하나로 정보를 질의
</form> : form의 끝을 알리는 tag
Form 기본태그 예제
<!DOCTYPE html>
<html>
<body>
<h2>form 태그 연습</h2>
<form action="frame.html">
당신의 이름은 무엇입니까?
<input name="firstname" type="text">
<br><br>
<input type="submit">
</form>
</body>
</html>
| exceeding the 65535 bytes limit (0) | 2022.07.04 |
|---|---|
| CSS 기본 내용 (0) | 2022.05.19 |
| HTML TABLE, IFRAME (0) | 2022.05.19 |
| HTML 기본 테그 (0) | 2022.05.19 |
| CSS 가상클래스 (0) | 2022.04.15 |
| CSS 기본 내용 (0) | 2022.05.19 |
|---|---|
| HTML FORM 테그 (0) | 2022.05.19 |
| HTML 기본 테그 (0) | 2022.05.19 |
| CSS 가상클래스 (0) | 2022.04.15 |
| 뷰포트(viewport), 미디어 쿼리 (0) | 2022.04.02 |
| HTML FORM 테그 (0) | 2022.05.19 |
|---|---|
| HTML TABLE, IFRAME (0) | 2022.05.19 |
| CSS 가상클래스 (0) | 2022.04.15 |
| 뷰포트(viewport), 미디어 쿼리 (0) | 2022.04.02 |
| CSS 고급선택자 - 화면 구성시 가장 참조가 될 듯 하다, 테스트파일 포함 (0) | 2022.04.02 |
| 자바스크립트 조건문 (0) | 2022.05.19 |
|---|---|
| 자바스크립트 객체 (0) | 2022.05.19 |
| 자바스크립트 DOM & Event (0) | 2022.04.26 |
| 자바스크립트 문서 객체 모델(DOM) (0) | 2022.04.25 |
| 자바스크립트와 객체 (0) | 2022.04.25 |
1. 노드에 접근하기
| 자바스크립트 객체 (0) | 2022.05.19 |
|---|---|
| 자바스크립트, 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) (0) | 2022.04.26 |
| 자바스크립트 문서 객체 모델(DOM) (0) | 2022.04.25 |
| 자바스크립트와 객체 (0) | 2022.04.25 |
| 자바스크립트, 함수와 이벤트 (0) | 2022.04.15 |
1. 문서 객체 모델이란 : 자바스크립트를 이용하여 웹 문서에 접근하고 제어할 수 있도록 객체를 사용해 웹 문서를 체계적으로 정리하는 방법
- 웹 문서와 그 안의 모든 요소를 '객체'로 인식하고 처리함
- (예시) 웹 문서 전체는 document 객체, 삽입한 이미지는 image 객체
2. DOM 트리
- 웹 문서에 있는 오쇼들 간의 부모, 자식 관계를 계층 구조로 표시한 것
- 나무 형태가 되기 때문에 "DOM 트리"라고 한다.
- 노드(node) : DOM 트리에서 가지가 갈라져 나간 항목
- 루트 노드(root node) : DOM 트리의 시작 부분(html)
3. DOM을 구성하는 원칙
- 모든 HTML 태그는 요소(element) 노드
- 웹 문서의 텍스트 내용은 요소 노드의 자식 노드인 텍스트(text) 노드
- 태그의 속성은 요소 노드의 자식 노드인 속성(attribute) 노드
- 주석은 주석(comment) 노드
3. DOM 요소에 접근하고 속성 가져오기
*DOM 요소에 접근하기 : 웹 문서에서 원하는 요소를 찾아가는 것을 "접근한다(access)" 고 함.
*getAttribute() 메서드 : 속성 노드의 값을 가져옴
*setAttribute() 메서도 : 속성 노드의 값을 바꿈
event-1.txt
0.00MB
event-2.TXT
0.00MB
event-3.TXT
0.00MB
event-4.TXT
0.00MB
event-5.TXT
0.00MB
event-6.TXT
0.00MB
4. DOM에서 이벤트 처리하기
domTree.txt
0.00MB
domNode-1.TXT
0.00MB
domNode-2.TXT
0.00MB
domNode-3.TXT
0.00MB
| 자바스크립트, 객체 메소드(Object methods), 계산된 프로퍼티(Computed property) (0) | 2022.04.26 |
|---|---|
| 자바스크립트 DOM & Event (0) | 2022.04.26 |
| 자바스크립트와 객체 (0) | 2022.04.25 |
| 자바스크립트, 함수와 이벤트 (0) | 2022.04.15 |
| 자바스크립트 기본 문법 (0) | 2022.04.15 |
1. window : 브라우저 창이 열릴 때매다 하나씩 만들어진다. 브라우저 창 안의 요소 중에서 최상위에 있다.
1-1. window 객체의 프로퍼티 : 주로 웹 브라우저 창의 정보를 가져오거나 값을 바꿀 때 사용
A. document : 브라우저 창에 표시된 웹 문서에 접근할 수 있다.
B. frameElement : 현재 창이 다른 요소 안에 포함되어 있을 경우 그 요소를 반환하고, 반대로 포함되어 있지 않으면 null을 반환한다.
C. innerHeight : 내용 영역의 높이를 나타낸다.
D. innerWidth : 내용 영역의 너비를 나타낸다.
E. localStorage : 웹 브라우저에서 데이터를 저장하는 로컬 스토리지를 반환
F. location : window 객체의 위치 또는 현재 URL 나타낸다.
G. name : 브라우저 창의 이름을 가져오거나 수정
H. outerHeight : 브라우저 창의 바깥 높이를 나타낸다.
I. outerWidth : 브라우저 창의 바깥 너비를 나타낸다.
J. pageXOffset : 스크롤했을 때 수평으로 이동하는 픽셀 수로 scrollX와 같다.
K. pageYOffset : 스크롤했을 때 수직으로 이동하는 픽셀 수로 scrollY와 같다.
L. parent : 현재 창이나 서브 프레임의 부모이다.
M. screenX : 브라우저 창의 왼쪽 테두리가 모니터 왼쪽 테두리에서 떨어져 있는 거리를 나타낸다.
N. screenY : 브라우저 창의 왼쪽 테두리가 모니터 위쪽 테두리에서 떨어져 있는 거리를 나타낸다.
O. scrollX : 스크롤했을 때 수평으로 이동하는 픽셀 수를 나타낸다.
P. scrollY : 스크롤했을 때 수직으로 이동하는 픽셀 수를 나타낸다.
sessionStorage : 웹 브라우저에서 데이터를 저장하는 세션 스토리지를 반환한다.
1-2. window 객체의 메서드 : window 객체는 기본 객체이므로 'window.' 를 생략하고 메서드 이름만 사용해도
alert() : 알림 창을 표시한다.
blur() : 현재 창에서 포커스를 제거한다.
close() : 현재 창을 닫는다.
confirm() : [확인], [취소] 버튼이 있는 확인 창을 표시한다.
focus() : 현재 창에 포커스를 부여한다.
moveBy() : 현재 창을 지정한 크기만큼 이동한다.
moveTo() : 현재 창을 지정한 좌표로 이동한다.
open() : 새로운 창을 Open한다.
postMessage() : 메시지를 다른 창으로 전달한다.
print() : 현재 문서를 인쇄한다.
prompt() : 프롬프트 창에 입력한 텍스트를 반환한다.
resizeBy() : 지정한 크기만큼 현재 창의 크기를 조절한다.
resizeTo() : 동적으로 브라우저 창의 크기를 조절한다.
scroll() : 문서에서 특정 위치로 스크롤한다.
scrollBy() : 지정한 크기만큼씩 스크롤한다.
scrollTo() : 지정한 위치까지 스크롤한다.
sizeToContent() : 내용에 맞게 창의 크기를 맞춘다.
stop() : 로딩을 중지한다.
-----------------------------------------------------------------------------------------------------------------------------
- 이름 미지정되어서 여러번 실행되면 여러번 열림
- 이름 notice 지정되어서 여러번 실행되도 1번만 열림
-----------------------------------------------------------------------------------------------------------------------------
2. document : 웹 문서마다 하나씩 있으며 <body> 태그를 만나면 만들어진다. HTML 문서의 정보가 담겨 있다.
-----------------------------------------------------------------------------------------------------------------------------
3. navigator : 현재 사용하는 브라우저의 정보가 들어 있다.
-----------------------------------------------------------------------------------------------------------------------------
4. history : 현재 창에서 사용자의 방문 기록을 저장한다.
-----------------------------------------------------------------------------------------------------------------------------
5. location : 현재 페이지의 URL 정보가 담겨 있다.
- 현재 문서의 URL 주소 정보가 담겨 있음
- 이 정보를 편집해서 브라우저 창에 열 사이트/문서 지정
-----------------------------------------------------------------------------------------------------------------------------
6. screen : 현재 사용하는 화면 정보를 다룬다.
- 사용자의 화면 크기, 정보
| 자바스크립트 DOM & Event (0) | 2022.04.26 |
|---|---|
| 자바스크립트 문서 객체 모델(DOM) (0) | 2022.04.25 |
| 자바스크립트, 함수와 이벤트 (0) | 2022.04.15 |
| 자바스크립트 기본 문법 (0) | 2022.04.15 |
| 자바스크립트 스타일 가이드 (0) | 2022.04.15 |
*검색 키워드 : rsa key fingerprint is sha256 are you sure you want to continue connecting
ssh로 해당 호스트 최초 접속시 fingerprint 관련 이슈 해결 - know_host 파일
https://blueyikim.tistory.com/1792
https://superuser.com/questions/1507193/what-does-this-ssh-message-mean-the-authenticity-of-host-cant-be-establis
https://not-to-be-reset.tistory.com/431
https://qwoowp.tistory.com/59
ssh 사용시 암호 대신 SSH key로 인증하기
( ssh key fingerprint)
https://arsviator.blogspot.com/2015/04/ssh-ssh-key.html
ssh 패스워드 없이 로그인 하기
https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=hansyoo&logNo=220868657393
Check SSH fingerprint
https://blog.raw.pm/en/check-ssh-fingerprint/
SSH - Host key verification failed
@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ @ WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED! @ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ IT IS POSSIBLE THAT SOMEO..
qwoowp.tistory.com
| K8S 실습 자료실 / 인프런 자료실 (0) | 2023.06.22 |
|---|---|
| 아파치 웹서버 (Apache HTTP Server) 동시 접속자 수 늘리기 (0) | 2022.07.11 |
| Unix Solaris crontab 실행 Log 확인 (0) | 2022.04.14 |
| Oracle Unix, Solaris Log파일 압축, 삭제, 개수 확인 등 명령어 (0) | 2022.01.19 |
| Oracle서버 솔라리스 OS에서 vi사용 시 글자입력 잘 안될 때 (0) | 2022.01.06 |
1. CSS 가상클래스
| HTML TABLE, IFRAME (0) | 2022.05.19 |
|---|---|
| HTML 기본 테그 (0) | 2022.05.19 |
| 뷰포트(viewport), 미디어 쿼리 (0) | 2022.04.02 |
| CSS 고급선택자 - 화면 구성시 가장 참조가 될 듯 하다, 테스트파일 포함 (0) | 2022.04.02 |
| 이미지와 그라데이션 효과로 배경 꾸미기 (0) | 2022.04.02 |
|
