전체 글

Calendar(일정 관리) 웹사이트 만들기 - 2

오늘 수강신청날이라 모든 신경이 다 수강신청에 가서 길게 못했습니다.. 하필 전공과목 하나를 못잡아서 너무 슬프네요 ㅠㅠ 오늘은 일정표에서 년도와 월을 바꿀 수 있도록 코드를 짰습니다! 이번에는 만드는데 그렇게 시간을 쓰지는 않았지만.. 그래도 고민을 좀 많이 한 것 같습니다. 태그를 사용하여 div 안에 div를 넣고 배치하는 형식으로 코드를 짰는데, 처음 제대로 사용하려다 보니 코드가 많이 더러워 지는 느낌이 없지 않아 있네요 ㅎㅎ.. 그렇게 해서 다 짜고 나니.. 문제가 하나 있었습니다. 달이랑 년도는 잘 넘어가는데, 오늘 날짜에 배경색을 칠해놓은게 변하지가 않더라고요! 또 저번달과 다음달의 박스 색들도 바꾸는걸 잊고 있었습니다. 그래도 미리 id들을 설정해놓아서 그걸 토대로 잘 넘어가게 만들었습니..

Calendar 만들면서 배운 것들 [querySelector, insertAdjacentHTML]

document.querySelector("#calendar").insertAdjacentHTML("beforeend", calendar_doc); calendar 만들때 사용했던 코드입니다. ... querySelector 이 친구를 통해 id가 calendar인 친구(#calendar)의 엘리먼트들을 가져옵니다. 만약 어떤 변수를 선언하고 함수를 수행했으면 선언한 변수에 가져오려 했던 엘리먼트들이 저장이 될 것 입니다. insertAdjacentHTML 이 친구는 HTML 같은 특정 텍스트를 파싱하고, 원하는 위치에 넣고자 하는 text를 넣을 수 있게 해준다. element.insertAdjacentHTML(position, text); position은 아래 4개의 단어만 사용이 가능하다. bef..

Calendar 만들면서 배운 것들 [Date()]

Date() Date() 함수를 사용해서 오늘 날짜를 가져오는 작업을 하였습니다. var date = new Date(); 변수 date는 Date 객체가 되어 날짜정보를 가지게 되는데, Date 객체의 method를 통해 연, 월, 일 등의 값을 얻을 수 있습니다. getFullYear() 네자릿수의 연도를 반환 getMonth() 월을 반환 ( 0 (1월) ~ 11 (12월) ) getDate() 일을 반환 ( 1 ~ 31 ) getDay() 요일을 숫자로 나타냅니다. ( 0 (일요일) ~ 1 (토요일) ) var setDate = new Date(year, month, day); 위 코드와 같이 직접 연, 월, 일을 넣어 Date 객체를 생성해서 사용할 수 있습니다.

Calendar(일정 관리) 웹사이트 만들기 - 1

남은 방학기간동안 작은 프로젝트라도 하나 하려고 여러가지 고민을 했었습니다. 백엔드 쪽을 전공으로 가려고 하니, 웹관련 언어들을 먼저 공부하는게 맞는 것 같았고... 기본을 다 배우고 나니, 제대로 된 웹사이트 하나를 만들어놔야 백엔드 쪽을 들어갈 수 있을 것 같았습니다. 그래서 간단한거라도 만들려고 여러 아이디어를 생각해봤는데, 달력으로 일정을 관리하는 웹사이트를 만들어보는게 좋을 것 같았습니다. jQuery 라던지 여러 프레임워크(?)들에 기본calendar가 들어가 있는걸로 알지만, 직접 달력 프레임을 짜보면서 공부하는게 맞을 것 같아서 다른 사람들이 만들어 놓은거 여러개를 뒤져가면서 공부했습니다. 처음 달력을 만드려고 하다보니, 날짜를 어떻게 가져와서 배치를 해야할지 잘 몰랐습니다. 그래서인지 날..

JavaScript 기본 문법

변수와 상수 var 을 사용하여 변수 선언 반복문 과 가정문 다른 c언어나 java와 같은 형태로 사용 document.write()를 통해 html에 작성가능 를 사용하여 공백 표현 함수 확인 function 을 통해 함수 선언 document.getElementById() 를 통해 가져오고자 하는 값을 가져올 수 있음. isNaN() 으로 숫자인지 아닌지 확인 가능

HTML 기본 태그 정리 (2)

HTML 태그 정리 (2) img 태그는 stylesheet를 사용하지 않고, width와 height 등 선언 가능 stylesheet로도 사용하여 표현이 가능 DIV태그입니다. 두번째 DIV태그입니다. 두번째 DIV태그입니다. div는 블록형태로 한 줄을 차지하는 개념 style의 display를 inline으로 선언하면 span처럼 표시가 됨 float 를 통해서 위치를 지정해줄 수 있음 clear를 통해 다른 div와 관계없이 자율적으로 배치 가능 SPAN태그입니다. 두번째 SPAN태그입니다. span은 한 줄을 다 차지하지는 않음 Example Title Descipt html html is ... JavaScript JavaScript is ... Total 2 caption은 제목과 비슷한 ..