CSS? ( Cascading Style Sheet ) HTML, XHTML, XML 같은 문서의 스타일을 꾸밀 때 사용하는 스타일 시트 언어. 즉, HTML로 문서가 단순히 집을 만드는 과정이라면, CSS는 HTML 문서의 인테리어, 페인팅하는 작업이라고 생각하면 된다. 문자의 컬러, 종류, 형태 지정, 배경화면 설정, 이미지 지정, 테두리 넣기 등등.. 각종 tag에 이미지 형태 라인 형태로 설정 p tag p 태그 입니다 id=p1 h3 태그 입니다 id=p1 p 태그 입니다 class=cls h3 태그입니다 class=cls p tag p 태그 입니다 id=p1 h3 태그 입니다 id=p1 p 태그 입니다 class=cls h3 태그입니다 class=cls CSS 적용하는 방법 태그명 접근 "태그..

예제코드 1 json의 경우 xml과는 다르게 단순하게 .(dot)을 통해서 접근이 가능하다. options의 경우처럼 여러개의 value가 있는 경우 배열의 인덱스를 통해서 접근이 가능하다. 예제코드 2 번호제목(title)저자(author)가격(price) book.json [ { "title":"자바의 정석", "author":"남궁성", "price":30000 }, { "title":"모던 자바스크립트 Deep Dive", "author":"이응모", "price":45000 }, { "title":"하루 10분 SQL", "author":"한상일", "price":24000 }, { "title":"지쳤거나 좋아하는 게 없거나", "author":"강한별", "price":13500 }, { ..

JSON ( Java Script Object Notation ) JSON 그 자체는 단순히 데이터 포맷일 뿐이다. 어떠한 통신 방법도, 프로그래밍 문법도 아닌 단순히 데이터를 표시하는 표현 방법이다. "키-값 쌍"으로 이루어진 데이터 오브젝트를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷이다. 데이터를 저장하거나 전송할 때 많이 사용되는 경량의 DATA 교환 형식 JSON 표현식은 사람과 기계 모두 이해하기 쉬우며 용량이 적다. XML을 대체해서 데이터 전송 등에 많이 사용 된다. JSON은 데이터 포맷팅중 하나이며, 데이터를 표시하는 표현 방법이다. Client(Ajax) Server(java) Json ArrayList,HashMap .... Json 은 key와 valu..

예제코드 XML문서 1 홍길동 서울시 2020/03/23 2 성춘향 남원시 2021/01/31 3 일지매 부산시 2019/07/11 let xhttp = new XMLHttpRequest(); 통신 하기 위해서는 객체가 필요하다 순서 함수 -> open -> send -> 함수 요청 readyState : 진행 상태 0 -> open 메소드를 수행하기 전 상태 1 -> loading 중..... 2 -> loading 완료 3 -> Server 처리중 4 -> Server 처리 완료 status : 상태 200 -> 성공(success) 403 -> 접근금지 404 -> 없음. 못찾는 경우. ex) test.txt가 없는 경우 500 -> 구문에러(문법 에러) responseText 다 읽었을때 txt를..

참고 : https://developer.mozilla.org/ko/docs/Web/API/DOMParser

XML (EXtensible Markup Language) 데이터를 설명하는 태그(Tag)를 사용자 마음대로 정의할 수 있다. XML은 HTML과 비슷한 문자 기반의 마크업 언어 이다. 하지만 명백한 차이가 있다. XML은 다른 시스템끼리 다양한 종류의 데이터를 손쉽게 교환할 수 있도록 해주며, 새로운 태그를 만들어 추가해도 계속해서 동작하므로 확장성이 좋다. XML은 텍스트 데이터 형식의 언어로 모든 XML 문서는 유니코드 문자로만 이루어진다. XML의 목적 HTML처럼 데이터를 보여주는 목적이 아닌, 데이터를 저장하고 전달할 목적으로만 만들어졌다. XML의 목적 = 데이터 저장, 데이터 전달.. XML vs HTML XML은 데이터를 전달하는 데에 포커스를 맞춘 언어 HTML은 데이터를 표현하는 데에..

hello world i can do it Never change my mind Nodelist document.getElementsByTagName('p')를 통해서 모든 p태그를 배열로 반환을 받아서 배열의 길이만큼 반복하여 모든 p태그의 배경색을 변경해보는 예제이다. hello world i can do it Never change my mind Nodelist

DOM? (Document Object Model) 각 tag를 접근하기 위한 object, 그 object를 접근하기 위한 함수들 Document = 문서 -> 문서안의 tag에 접근하도록 만들어진 Object Object = 객체 문서 객체 모델 DOM은 HTML, XML 문서의 프로그래밍 interface이다. DOM은 문서의 구조화된 표현(Structured representation)을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 돕니다. DOM은 구조화된 nodes와 property와 method를 갖고 있는 object로 문서를 표현한다. getElementById() - id 속성을 가진 요소를 찾고, 이를..

key onkeydown 키룰 눌렀을 때 onkeypress 키를 누르고 있을 때 onkeyup 키를 누르고 뗐을 때 mouse onclick 객체를 클릭했을 때 onbdclick 더블클릭할 때 onmouseover 마우스가 객체위에 올라왔을 때 onmouseout 마우스가 객체 바깥으로 나갔을 때 onscroll 스크롤바를 조작할 때 그 외 onblur 객체가 focus를 잃었을 때 onchange 객체의 내용이 바뀌고 focus를 잃었을 때 onerror 에러가 발생했을 때 onfocus 객체에 focus가 되었을 때 onload 문서나 객체가 로딩되었을 때 onreset reset 버튼을 눌렀을 때 onresize 객체의 크기가 바뀌었을 때 onsubmit 폼이 전송될 때 [마이데일리 = 양유진 기..

index2로 이동하기 href replace() html에서는 tag 혹은 submit button을 이용해서 페이지를 이동시킬 수 있다. JasvaScript에서 페이지 이동은 location.replace(), location.href 가 있다. index2로 이동하기 hrefreplace(link)window.open(link) location.replace('link') 현재 페이지를 덮어 씌우기 때문에 replace를 사용해서 페이지를 넘어가게 되면 이전 페이지로 돌아갈 수 없다. location.href tag와 동일하게 페이지 이동을 하는 메서드 이다. replace()와 다르게 이전 페이지로 돌아갈 수 있다. window.open('link') 새창으로 열기 동일하다. vs JavaScr..