전체 글
객체 지향 프로그래밍(OOP : Object Oriented Programming)
객체 지향 프로그래밍이란? 컴퓨터 프로그램을 "객체(Object)"들의 모임으로 파악하고자 하는 프로그래밍의 패러다임 중 하나이다. 각 객체들은 서로 메시지를 주고 받으며 데이터를 처리할 수 있다. 객체 지향 프로그래밍(OOP)의 장점 프로그램을 유연하고 변경이 용이하게 만든다. 남이 만든 클래스를 가져와서 이용가능하며 상속을 통해 확장할 수 있다. 프로그램의 개발과 보수를 간편하게 만든다. 절차 지향 프로그래밍에서는 코드를 수정해야할 때 일일이 찾아 수정해야하지만, 객체 지향 프로그래밍에서는 수정해야 할 부분이 클래스 내부에 멤버 변수혹은 메서드로 존재하기 때문에 해당 부분만 수정하면 된다. 직관적인 코드 분석을 가능하게 한다. 직관적인 코드분석이 가능 하므로 여러 회사에서 프로젝트를 개발할 때 업무 ..
Javascript - 이벤트(Event)
○ 이벤트란? 웹 브라우저가 알려주는 HTML요소에 대한 사건의 발생 ○ 이벤트 타입 발생한 이벤트의 종류(폼, 키보드, 마우스, HTML DOM, Window 객체 등) 여길 클릭하세요! ○ 이벤트 핸들러 이벤트가 발생했을 떄 그 처리를 담당하는 함수 지정된 이벤트가 발생하면 웹브라우저는 그 요소에 등로된 이벤트 핸들러를 시행시킨다. //이 함수는 html 문서가 로드될 떄 실행됨. window.onload=function(){ var text=document.getElementById("text"); text.innerHTML="HTML 문서가 로드되었습니다."; }
Javascript - Node 객체
○ Node의 종류 문서 노드 요소 노드 주석 노드 속성 노드 텍스트 노드 ○ Node의 값 노드에 대한 정보는 다음과 같은 프로퍼티를 통해 접근 가능 //HTML 문서의 모든 자식 노드 중에서 첫번째 노드의 이름을 선택 Document.ChildNodes[0].nodeName; //아이디가 "heading"인 요소의 첫번째 자식 노드의 노드 값을 선택 document.getElementById("heading").firstChild.nodeValue; //아이디가 "heading"인 요소의 첫번째 자식 노드의 타입을 선택 document.getElementById("headig").firstChild.nodeType;
Javascript - 자바스크립트와 DOM
○ DOM 요소의 선택 //html 요소를 선택 var selectedItem=document.getElementsByTagName('li'); //아이디가 id인 요소를 선택 var selectedItem=document.getElementById('id'); //클래스가 odd인 요소를 선택 var selectedItem=document.getElementsByClassName('odd'); //name 속성값이 "first"인 요소를 선택 var selectedItem=document.getElementsByName('first'); ○ DOM 요소의 스타일 변경 var selectedItem=document.getElementById("ever"); //선택된 요소의 텍스트 색상을 변경 selec..
javascrpit (2) 연산자
증감연산자 var num=10; console.log(++num);//num+1 후 num 출력 console.log(--num);//num-1 후 num 출력 console.log(num++);//num 출력 후 num+1 출력 console.log(num--);//num 출력 후 num-1 출력 비교연산자 console.log(10==20); //값이 같다. 결과값 : False console.log(10 === 20); //데이터 타입과 값이 같다. 결과값 : False console.log(10!==20); //값이 같지 않다. True for문 for(초기화한 변수값;조건;증감 표시){ 수행할명령 } for(var=i=0;i
javascript
Javascript란? 이미지 슬라이드 효과, 팝업 효과 등의 기능을 포함한 동적인 웹사이트 제작 시 사용되는 프로그래밍 언어 외부 스크립트 사용하기 (Html body 내) 외부 스크립트 사용하기 (JS파일) var heading=document.querySelector('#heading'); heading.onClick=function(){ heading.style.color="red"; }