
함수 함수는 프로그램이 있어 가장 중요한 영역입니다. 함수는 실행문을 저장하여 사용할 수 있으며, 함수의 형태는 다양하기 때문에 다양한 함수의 사용방법을 익히고 해석 할 수 있어야 합니다. 변수에는 데이터만 저장할 수 있고, 코드는 저장할 수 없습니다. 하지만 함수를 사용하면 코드를 메모리에 저장했다가 필요할 때 마다 호출하여 사용할 수 있습니다. 선언적 함수 함수를 사용하여 코드를 저장한 것을 '함수 정의문'이라고 합니다. 변수를 선언할때 var 키워드를 사용한 것처럼 함수에서는 function 키워드를 사용해 변수를 선언합니다. function 함수명( ){ 자바스크립트 코드; } 익명 함수 익명 함수는 함수명 대신 변수명에 함수 코드를 저장하는 구현 방식이다. 익명 함수의 소스 코드는 변수값이므로 ..

기본 선택자 속성 예시 설명 태그 선택자 p {color : #fff} p 태그를 선택하여 글씨 색을 하얀색으로 변경합니다. 클래스 선택자 class {color : #fff} class를 선택하여 글씨 색을 하얀색으로 변경합니다. 아이디 선택자 #id {color : #fff} id 아이디를 선택하여 글씨 색을 하얀색으로 변경합니다. 그룹 선택자 div, p {color : #fff} div 태그와 p태그를 선택하여 글씨 색을 하얀색으로 변경합니다. 전체 선택자 * {color : #fff} 전체 요소(태그)를 선택하여 글씨 색을 하얀색으로 변경합니다. 계층 선택자 속성 예시 설명 하위 선택자 (Descendant Selector) div p {color : #fff} div 태그의 모든 자식 중 p ..

IR 기법(Image Replacement)은 무엇인가? 웹접근성은 몸이 불편한 사람이라도 정보를 이용하는데 불편함이 없도록 하는것이 목적에 있기 때문에 만약 시각 장애인이 사이트를 이용할 경우 텍스트는 리더기로 읽어줄 수 있지만 이미지는 읽을 수가 없다 그래서 이미지에 텍스트를 붙여준다. 또한 css가 동작하지 않는 환경에서도 어떤 내용인지 파악이 가능해야 하기 때문에 백그라운드로 넣어주는 이미지라고 할지라도 텍스트를 써주는 것이 좋다. ir 종류 ir_pm (Phark Method) ir_wa (WA IR) ir_so (Screen out) ir_pm 의미있는 이미지의 대체 텍스트를 제공하는 경우 이미지로 대체할 엘리먼트에 배경이미지를 설정하고 글자는 text-indent를 이용하여 화면 바깥으 로 ..

1. HTML 태그를 통해서 표현 : img 태그 HTML 문서에서 이미지를 표시하기 위해 사용하는 img 태그에는 src라는 속성이 있고, 이 속성은 속성값으로 표시할 이미지 소스 파일의 위치 정보, 즉 url을 입력받습니다. 이번 포스팅에서는 이 src 속성에 url을 지정하는 몇 가지 방법에 대해서 소개하도록 하겠습니다. 1. 상대경로 2. 절대경로 3. 웹서버 주소 상대경로 상대경로는 이미지를 표시할 HTML 문서의 위치를 기준으로 이미지 소스 파일의 위치를 인식하는 방식입니다. 상대경로를 지정하기 위해서는 다음의 기호들을 적절히 사용해주어야 합니다. 절대경로 절대경로는 간단합니다. 표시하고 싶은 이미지의 위치 값을 그대로 가져오기만 하면 됩니다. 이미지가 저장되어 있는 폴더를 열고 '주소를 텍스..

ID id는 한페이지에 하나의 정의로 단, 하나의 태그(id="")만 사용할 수 있다. 즉 로고,상단메뉴,하단정보 같은 스타일을 정의할 때 id를 사용한다. CLASS class는 한페이지에 반복적으로 사용되는 스타일을 정의할 수 있다. 반복적으로 사용되는 스타일에는 class를 이용하여 정의하고, 그 내부에 세부 스타일을 정의할 때 id를 사용해주면 효과적이다. 이름을 불러오는 방식 클래스(class)를 불러올 때는 앞에 마침표(.)를 찍어줍니다. 아아디(id)를 불러올 때는 앞에 샵(#)표시를 해줍니다. 한 요소가 갖는 클래스 & 아이디의 갯수 제한 클래스(class)는 한 요소에 여러 개의 클래스명이 적용될 수 있다. 아아디(id)는 한 요소에 한 아이디만 적용이 가능하다.

반복문 반복문을 이용하면 코드를 원하는 횟수만큼 반복하여 실행할 수 있습니다. 가령, "안녕하세요!"라는 문구를 100회 출력하려면 출력문을 100번 작성해야 하지만 반복문을 사용한다면 한 줄의 출력문으로 100회 출력할 수 있습니다. 반복문에는 while문과 do while문, for문이 있습니다. while문 while문은 조건식에 만족할 때까지 반복적으로 실행하는 반복문입니다. 조건식을 검사하고 만족하면 실행문을 실행하고 증감식을 실행합니다. do while문 while문은 조건을 검사하고 코드를 반복적으로 실행합니다. 첫 조건이 거짓이라면 코드를 실행하지 않을 수 있습니다. 하지만 do while문은 조건이 참, 거짓과 상관없이 최소한 한 번은 실행합니다. break문과 continue문은 반복문..

데이터 타입(자료형) 변수에는 여러가지 유형이 들어갈 수 있습니다.프로그램 언어에 있어 가장 기본적인 요소이며, 데이터 타입이라고 합니다. 데이터 타입에는 숫자, 문자열, 논리값, 특수값, 심벌, 객체, 배열, 함수 등을 표현할 수 있습니다. 숫자(Number) 숫자형으로 정수와 부동 소수점, 무한대 및 NaN(숫자가 아님)값을 포함한다.문자열(String) 문자열(String) JavaScript의 String 타입은 텍스트 데이터를 나타낼 때 사용합니다. 논리값(Boolean) Boolean 타입은 논리 요소를 나타내며 true와 false 두 가지의 값을 가질 수 있습니다. 특수값(Null) Null 타입은 null 하나의 값만 가질 수 있습니다. 특수값(Undefined) Undefined 타입의..

조건문이란? 조건문은 조건식의 값이 참(true) 인지, 거짓(false)인지에 따라 자바스크립트 코드를 제어 합니다. 예를 들어 질의응답 창을 이용해 방문자가 좋아하는 숫자를 입력받습니다. 이때 입력된 값을 2로 나누어 나머지 값이 0이면 "당신이 좋아하는 숫자는 짝수입니다."라고 출력하게 되고, 아닐 경우에는 "당신이 좋아하는 숫자는 홀수입니다." 라고 출력하게 한다고 합시다. 이렇게 수를 나눈 나머지 값에 따라 다른 결과를 출력하게 하려면 조건문을 사용해야 합니다. 조건문의 종류에는 if문, else문, 그리고 if else문이 있습니다. if문 if 문은 조건식을 만족(true) 할 경우에만 코드를 실행합니다. 다음은 if문의 기본형입니다. 조건식은 앞에서 배웠던 Boolean() 내장 메서드와 ..