:: 오픈프레임워크

오픈프레임워크_Day57

OpenFrameWork 2015. 6. 4. 08:59

### : 목차 구분 기호
--- : 목차 내에 항목 구분 기호
@@@ : 태그 용도

,,, : 같은 항목 내에 구분 기호

목차
1. 이론 및 정보
2. 설정 및 그 밖에
3. 소스코드 또는 실습
4. 과제

###################################
1. 이론 및 정보
-----------------------------------

(6) Event 관련 메서드

1) bind(type,data,fn) : javascript의 addEventListener 와 같은 기능, 이벤트 연결

- 매치된 요소의 이벤트 처리기를 바인딩한다.

type에는 이벤트 명칭을

data에는 부가적으로 전달할 데이터 객체(JSON)를,

fn에는 이벤트 처리기 함수를 작성, data를 가져다 쓸 수 있음, 매개변수로

2) unbind(type,fn) : bind로 이벤트로 추가한 내용을 삭제

- 매치된 요소에서 지정된 이벤트와 매핑된 모든 처리기들을 제거한다.

3) one(type,data,fn) : 한번의 이벤트만 실행되는 함수

- 매치된 요소에 오직 한번만 실행되는 이벤트 처리기를 바인딩

4) trigger(event,data)

- 매치된 요소의 특정 이벤트를 트리거한다.

click()메서드는 자주 쓰기 때문에 넣어 준거지

기본적으로 bind()를 사용해야함

-----------------------------------

* JSON은 데이터를 묶어 주는 하나의 단위, 간단하게 묶어 줄때, 단순하게 묶을 때 사용

Properties 들을 JSON 형식으로 사용 가능

아래와 같은 형식으로 데이터를 묶어 주는 것을 JSON 형식이라고 함

{키:값,키:값,...}

-----------------------------------

* JQuery 마무리

jQuery 아직은 문제가 있으나

꾸준하게 업데이트가 되고 있음

실무에서 jQuery를 많이 쓰고 있음

javaScript 보다는 jQuery를 쓰도록 노력을 하라

-----------------------------------

* XML(Extensible Markup Language)

-> 매우 지루! 그래서 다른 언어에서 응용을 하는 것이 재미있음

-> XML에서 java에서 어떻게 응용?

-> XML에서 jsp에서 어떻게 응용? AJAX -> Android

-> 태그로 이루어짐

- XML History

GML(General Markup Language)을 W3S에서 만듬, 회사에 홍보

회사마다 자기 회사 나름대로 만들어서 서로 호환이 안됨

그래서 하나의 기준이 되는 SGML을 만듬, 회사에 홍보, 많이 쓰지 않음

왜?? 기능이 많으나, 너무 복잡함

뛰어난 기능을 가지고 있었으나, 처음 익히기가 너무 어려웠음

DB를 사용하지 않고 쓸 수 있을 만큼 매우 좋은 언어였음

어떤 프로그램에도 종속적이지 않고, 거기다 무료였음

SGML의 복잡하고 어려운 부분을

전부 빼고 쉽고 간단하게 만든 언어가 바로 XML

SGML의 한 갈래(자식)로 HTML이 있음

XML 만드는 프로그램은 메모장으로도 가능하나 수업에서는

1. 특징

(1) 메타 언어 - 언어를 만들 수 있는 언어

(2) DB를 저장하는 역할

(3) 데이터의 표준화

특정 프로그램이 다른 프로그램에게 데이터를 전달하는데

받는 쪽에서도 특정 프로그램이 필요함,

이런게 데이터가 프로그램에 종속적이게 된다

네트워크에서 데이터를 주고 받을 때에는 표준화된 데이터로

주고 받는게 어떠한 프로그램에서든 사용 가능

이러한 표준화된 호환성 때문에 XML 사용

(4) 이기종 시스템간의 정보 교환, 웹서비스(분산환경시스템), 유비쿼터스

기타 등등...

2. HTML vs XML

HTML은 대부분 데이터의 디자인을 위해서 태그들을 사용함

HTML은 태그가 정해져 있음

<h1>데이터</h1>

XML은 태그를 직접 만들 수 있음, 데이터를 설명하기 위한 태그

검색이 용이함, 태그가 필드명처럼 사용이 된다

<tel>데이터</tel>

3. 문법

아래 세가지 언어가 가장큰 줄거리

DTD(설계도, 인터페이스, 간단), XML 스키마(설계도, 복잡), XSL(디자인)

DTD가 있으면 까다롭지만, 일관성 면에서 유리, 기능이 약함, 범위가 제한

XML 스키마는 디테일 한 내용까지 설계가 가능하고 복잡하고 어려움

XSL 디자인을 꾸며주는 언어

(1) XML 문서 종류

1) well-form xml document(잘 짜인 문서, 기본 규칙을 지켜서 만든 문서)

2) valid document(1번 통과 후, 설계도에 의해 잘 만들어 진 문서)

(2) XML 문서 구조

1) Prolog - 머리 - 반드시 1개, 자식은 여러개 있어도 됨

2) Element - 몸통 - 반드시 1개, 자식은 여러개 있어도 됨

3) Misc - 기타 - 0개 이상

(3) Element

1) 작성문법

- 모든 XML문서는 반드시 단 하나의 루트 엘리먼트를 갖는다.

- 루트는 여러개의 자식 엘리먼트를 가질 수 있고 또 그 자식도 자신의 자식을 가질 수 있다.

2) 종류

- 내용을 가지는 엘리먼트

- 내용이 없는 엘리먼트(시작태그와 끝태그 사이에 공백이 없어야한다. 공백도 하나의 데이터임)

3) 작성 규칙

- 시작태그와 끝태그는 반드시 짝을 이루어야 한다.

- "<"는 값으로 사용 불가, ">"는 사용할 수 있으나 가급적 사용 금지(&lt, &gt)

- "<"와 ">" 사이에 오는 태그명 중에 공백 문자는 올 수 없다.

- 종료태그의 "</" 다음에 공백문자가 올 수 없으며 반드시 시작태그명과 같은 이름이어야한다.

- 엘리먼트는 중첩되어 사용할 수 없다.<a><b></a></b> 일부만 중첩 될때, 포함은 가능함

4) 태그명 작성 규칙

- 이름은 문자로 시작. 첫번째 문자는 특수문자 중에 "_"로 시작 가능

하지만 숫자나 "."으로 시작 불가

- 두번째 부터는 숫자 및 특수문자 "-","_","." 도 가능

- 태그명에 공백 불가

- 특수문자 중 "."은 사용 가능하나 가급적 사용하지 말자. (namespace와 혼동 됨)

- 태그명은 대소문자 구별

- 태그명은 XML로 시작불가

5) 엘리먼트의 내용

- 문자 데이터

- 자식 엘리먼트

- 엔티티 또는 문자 참조(문자를 따로 만들어 놓고 별도의 변수처럼 사용)

- CDATA section(문자 데이터를 제약없이 마음대로 문자 사용 가능)

- 프로세싱 지시자(프로그램 연결 시 사용?)

- 주석()

- 공백 문자열(White Space)

(4) DTD

1) 종류

- 내부 DTD - 설계도를 XML안에 포함 시킴, 많이 사용 안함

- 외부 DTD - 설계도는 XML 외부에 있음

2) 구성 요소

- 엘리먼트 선언

- 속성(Attribute - 태그명 다음에 오는 것들) 선언

- Entity 선언

- Notation 선언

- 프로세싱 지시자

- 파라미터 엔티티 참조

- 주석

- 공백

- Conditional Section

3) 문서 유형 선언

DTD를 가져다 쓰겠다는 의미 DOCTYPE

SYSTEM특정 정해는 것들만 사용 가능

PUBLIC은 누구나 사용 가능

식별자는 URL이나 경로, 다운 받기 위한 목적이 아닌 구별하기 위한 목적으로 쓰기도함

<!DOCTYPE 루트 엘리먼트 SYSTEM 또는 PUBLIC "식별자">

특히 PUBLIC인 경우

+-//DTD를 개발 및 유지 보수 업체//DTD명 및 버전번호//사용된 언어

4) ELEMENT 선언

- <!ELEMENT 엘리먼트명 컨텐트 유형>

- 컨텐트 유형

#PCDATA : 내용으로 문자데이터만 갖는 엘리먼트

자식엘리먼트_리스트

, : 엘리먼트의 작성 순서

| : 엘리먼트를 선택해서 작성

? : 생략하거나 한번만 작성

+ : 한번 이상 (생략은 안됨, 1개 이상)

* : 생략하거나 여러번 작성(0개 이상)

기호 없음 : 단 한번만 작성

EMPTY : 반드시 아무것도 없어야함(img 태그)

MIXED : 문자데이터 또는 자식 엘리먼트를 혼합형태로 갖는다

ANY : 모든 유형을 다 가질 수 있음

5) ATTRIBUTE 선언

- <!ATTLIST 엘리먼트명

속성명 속성유형 디폴트 선언

...

-----------------------------------

###################################
2. 설정 및 그 밖에
-----------------------------------

* 프로젝트 새로 만듬

Dynamic Web Project - XmlApp

파일 추가

프롤로그가 아래 내용임

version은 있어야 하고 encoding은 생략 가능

<?xml version="1.0" encoding="UTF-8"?>

-----------------------------------

* DTD 만들기

-----------------------------------

-----------------------------------
###################################
3. 소스코드 또는 실습

-----------------------------------

3-1

생성 - jQuery 연습 - 이벤트 관련 메서드