[Web] - DOM 객체 / JS

1. DOM을 이용한 화면 변경

✏️ Test1.

💻 입력

돔객체

• HTML / XML (일반적으로 많이 쓰는 것)

: Text로 만들어져 있는 HTML / XML를 object = class 객체화 시키는 작업

<div>태그를
ex) var a = document.getElementById 로 한거

a = 얘가 클래스가 됨 그래서

a. innerHTML = 클래스 내 메서드를 콕! 집을 수 있음

---

• 클래스를 쓰는 이유?
  : 메소드를 쓰기위해서

---

• 객체화란?
  : (class로 바꿔서 class.)method를 쓰기 위해

---

✅ 결과

:추가/삭제 누르면 늘어나고 줄어들어야 함

---

2. xml파일을 읽어오기

✏️ Test2.

💻 입력

그러면 먼저 xml 파일 생성

(xml파일 불러오는) jsp파일 만들기

---

3. DB에서 읽어와서 XML형태로 바꿔서 돌려주기

✏️ Test3

💻 입력

---

✅ 결과

:아작스로 받고있어서, 초가 지나도 숫자가 사라지지않음

---

4. 자바스크립트

✏️ Test4

💻 입력

---

---

jsp파일 생성

---

의 이름과 같아야함

---

✅ 1) js없이 객체 생성 1번

✅ 2) js없이 객체 생성 2번

✅ 3) 생성자를 통한 객체 생성 3번

✅ 4) setter를 통해 데이터 삽입

✅ 4) getter를 통해 데이터 삽입

---

(자바스크립트) json을 사용해서 패키지형태의 getter/setter 만들기

JSON : KEY : VALUE

setValue : function (id,name,addr){ this.id = id; this.name = name; this.addr = addr; }

---

Json형태의 데이터

---

4. DB형태에서 꺼내쓰기

✏️ Test4

💻 입력

• 오라클 -> 꺼내와서 html(주로) / xml로 뿌리기
• api 외부데이터로 가져오면 xml
• 몽고디비 같은 경우엔 -> json형태로 받아야함

---

---

등록 (sqlMap)

---

https://getbootstrap.com/

---

https://www.w3schools.com/

예시 사용법