소스 코드 예제

1. 간단히 살펴보는 자바스크립트 역사

2. 자바 스크립트 문법 익히기

3. 문서 객체 모델(DOM)이란?

   • Test: alert title 속성

4. 자바스크립트로 만드는 온라인 사진첩

   • Image Gallery 1: 자바 스크립트 없는 페이지
   • Image Gallery 2: 사진 넣기
   • Image Gallery 3: 사진 및 텍스트 넣기
   • Image Gallery 4: 스타일

5. 꼭 알아야 할 핵심 기본기

   • Example: 스크립트 분리로 팝업 창 만들기

6. 사진첩 기능 개선하기

   • Image Gallery 1
   • Image Gallery 2
   • Image Gallery 3

7. 실행시에 마크업 코드 생성하기

   • Test: document.write inline
   • Test: document.write external
   • Test: alert innerHTML
   • Test: innerHTML 업데이트
   • Test: alert node info
   • Test: createElement
   • Test: createTextNode
   • Test: appendChild
   • Test: documentFragments
   • Test: documentFragments

8. 의미가 살도록 컨텐츠 개선하기

   • 축약어 표시
   • 인용구 표시
   • 접근키 표시

9. CSS와 DOM 연동하기

   • Example: 변경 CSS alert 보기
   • Itinerary: 테이블 띠무늬 만들기
   • Story: 첫 단락 스타일 입히기

10. 애니메이션 슬라이드쇼 만들기

    • Test: 포지션 및 이동
    • Message: 두개 요소 옮기기
    • Slideshow: 간단한 이동
    • Slideshow: 부드러운 이동

11. 총정리편 (더블트랙 웹사이트)

    • 첫 화면
    • 밴드 소개
    • 사진 모음
    • 연주 일정
    • 연락 하기

12. DOM 스크립트의 미래

• 부록

• Lightbox 2
• Sortable