WEB 75

자바스크립트 함수

함수 01/ 선언적 함수 선언함수는 자바스크립트 함수의 여백과 패딩을 관리하는 역할을 하는 함수를 말한다. 선언함수 안에서 margin과 padding의 값을 설정하여 함수의 여백과 패딩을 조절할 수 있다. { function func(){ document.write("실행되었습니다. "); } func(); } 02/ 익명 함수 익명함수란 이름이 없는 함수를 말한다. 익명함수는 함수 리터럴로 정의하며 주로 변수에 할당하여 사용하거나 함수의 인수로 전달하여 사용된다. 익명함수는 즉시 실행 함수로도 불리며 (IIFE, Immediately Invoked Function Expression) 함수 선언과 동시에 실행되는 특성을 가지고 있다. { const func = function(){ document.w..

WEB/JAVASCRIPT 2023.02.27

앞으로는 이렇게 하세요

10보다 큰 숫자 찾기 수업시간에 배운 배열을 이용하여 10보다 큰 수를 찾아내는 미션이다. 길라잡이 배열요소의 개수만큼 for문을 반복한다 if문을 사용해서 요소의 값과 10을 비교한다 document.write문을 사용해서 화면에 표시한다 자바스크립트 사용시 불편한 점 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다. 제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다.제목1에 대한 설명글 입니다. 불편한 점 제목1에 대한..

WEB/HTML 2023.02.27

자바스크립트 조건문 정리

자바스크립트 조건문 자바스크립트에서 조건문은 주어진 조건이 참(true)인 경우에만 실행되는 코드 블록을 만들 수 있도록 한다. 01. if문 if문은 가장 간단한 조건문이다. 주어진 조건이 참이면 실행되는 코드 블록을 만든다. // false : 0, null, undefined, false, ""(빈문자열) // true : 1, 2, "0", "1", "ABC", [], {}, true if(0){ document.write("실행되었습니다. (true)") } else { document.write( "실행되었습니다.(false)") } 02. if문 생략 const num = 100; // if(num){ // document.write("실행되었습니다.(true)") // } else { //..

WEB/JAVASCRIPT 2023.02.27

자바스크립트 반복문

" 반복문은 같은 동작을 여러 번 실행하기 위해 사용하는 문이다. 불필요하게 여러 명령을 늘어 놓을 필요없이 명령을 반복 실행할 수 있다. 그만큼 소스가 깔끔하고 프로그램 실행도 빠르다. 01/ for문 자바스크립트에서 가장 많이 사용하는 반복문이다. 조건에 들어가는 값이 일정하게 커지면서 명령을 반복실행 할 때 쓴다. 01/ 초깃값 : 카운터 변수. 몇번 반복할 지 지정하기 위해 카운터 변수를 선언하고 초기화한다. 0이나 1부터 시작. 02/ 조건 : 문장을 반복하기 위해 체크할 조건 03/ 증가식 : 보통 카운터값을 하나씩 증가시키는 용도로 사용 02/ forEach문 배열에서는 forEach문을 사용해서 좀더 쉽게 반복한다. / 콜백함수란, 다른함수의 인수로 사용할 수 있는 함수를 가리킨다. 프로그..

WEB/JAVASCRIPT 2023.02.23

html 구조 관련 요소

/ HTML 구조 관련 요소 종류 " 문서와 관련된 태그(Document Related Tag) / 문서의 최상단 요소를 나타냅니다. / 문서 정보에 해당하는 내용을 설정합니다. / 문서 본문에 해당하는 내용을 설정합니다. / 문서의 기본 URL을 설정합니다. / 문서의 외부 리소스를 설정합니다. / 문서의 메타 정보를 설정합니다. / 문서의 스타일 정보를 설정합니다. / 문서의 제목을 설정합니다. " 섹션과 관련된 태그(Section Related Tag) / 문서의 주요 콘텐츠 영역을 설정합니다. / 주제별 그룹의 콘텐츠 섹션을 설정합니다. / 문서의 독립적인 컨텐츠 섹션을 설정합니다. / 주요 콘텐츠의 보조적 컨텐츠 섹션을 설정합니다. / 문서의 소개 및 메뉴 그룹 컨텐츠 섹션을 설정합니다. / 문..

WEB/HTML 2023.02.22

id와 class의 차이점

선택자 (selector) HTMl문서의 요소 중 같은 요소라도 각기 다른 이름을 지정하여 따로 속성을 부여할 수 있다. 선택자의 종류는 type선택자, id선택자, class선택자, 등이 있다 / id와 class의 차이점 " id선택자 HTML 요소에 id 로 이름을 붙일 때에는 유일한 이름을 부여해야 하며, 다른요소에 같은 id명을 또 주면 안된다. CSS에서는 id선택자앞에 #을 붙여야 한다. *id명이나 class명은 숫자로 시작할 수 없고, 주로 영문으로 시작한다. " class선택자 HTML 문서의 여러 요소 중 같은 이름을 갖는 요소들만 모아 따로 속성을 부여할 수 있다. HTML요소에 같은 이름을 부여할 때에는 class로 이름을 붙인다. 즉, 여러개의 요소에 같은 class명을 부여 할..

WEB/CSS 2023.02.22

연산자의 종류

" 연산자 프로그램을 만드는 수식에 필요한 것이 연산자이다. 연산자의 종류는 산술연산자, 대입연산자, 비교연산자, 논리연산자 등이 있다. / 산술연산자 01/ '+' 연산자 더하기 연산을 할 때 사용한다. 문자와 문자, 문자와 변수 등을 연결할 때 사용한다. '+'를 기준으로 좌변과 우변에 숫자가 아닌 문자나 변수 등이 오면 더하기 연산이 아닌 연결 연산을 한다. 02/ %(나머지) 연산자 나머지를 구할 때 사용한다. '반복적인 숫자 구간의 패턴', 조건문을 이용한 '짝수 / 홀수 / 배수 판단' 등의 식을 만드는 데 사용한다. 03/ ++, -- 연산자 1씩증가하거나 1씩 감소할 때 사용한다. '+'와 '+' 사이, '-' 나 '-' 사이에 공백이 있으면 안된다. 주로 변수의 앞쪽에 붙여 사용한다. /..

WEB/JAVASCRIPT 2023.02.22

JAVASCRIPT : 자료형

id와 class의 차이점 " 자료형 (data type) 이란 프로그램에서 처리할 자료의 형태를 말한다. 예를 들어 3이라는 숫자를 숫자로 처리할지, 문자열로 처리할지에 따라 결과값이 달라진다. 컴퓨터는 프로그램이 처리할 자료의 유형을 명확히 지정해 주어야 일을 하는데 이러한 자료의 형태를 '자료형' 이라고한다. 자료형은 원시유형(primitive)과 객체(object)로 나뉜다. 원시유형(primitive) 원시 유형은 하나의 값만 저장하는 자료형이다. 숫자형, 문자열, 논리형, undefined, null, symbol 유형이 있다. 그 외는 모두 객체이다. 01. 숫자형(number) 자바스크립트에서는 정수와 실수를 묶어 '숫자형'이라고 한다. 따옴표 없이 입력하는게 원칙이며, 따옴표 안에 작성하..

WEB/JAVASCRIPT 2023.02.20

CSS 표현방법

" CSS 기본문법 CSS(Cascading Style Sheet)를 정의하는 방법으로는 내부 스타일시트, 외부스타일시트, 인라인 스타일시트 등이 있습니다. 01 / 내부 스타일시트 CSS를 HTML문서 안에 로 기재하여 HTML문서 안에 CSS가 함께 저장되도록 하는 형태입니다. 02 / 외부 스타일시트 스타일 속성들을 따로 저장하여 HTML문서에 파일명으로 연결할 수 있습니다. 이때 스타일은 *.css확장자를 가진 별도의 파일로 저장하고, HTML에서는 태그를 이용하여 선언합니다. 03 / 인라인 스타일시트

WEB/CSS 2023.02.20

시멘틱 마크업과 논리적인 순서 마크업

/ 시멘틱 마크업 이란 ? 시멘틱(Semantic)은 사전적으로 '의미론적인'이라는 뜻으로, 시멘틱 마크업은 '의미가 명시된 HTML 문서'이다. 시멘틱 마크업은 h1, header, nav, section, footer등 다양한 태그들을 문서 내용에 맞게 선택하여 사용하는 것을 말한다. / 시멘틱 태그 작성방법 헤더 / 푸터에 와 사용 내비게이션에 사용 메인 컨텐츠에 과 사용 독립적인 컨텐츠에 사용 최상위 제목으로 사용 순서가 없는 목록으로 과 사용 / 시멘틱 마크업의 필요성 SEO - 검색엔진 최적화에 유리하다 웹접근성 - 시각장애인들도 웹을 편리하게 접할 수있도록 도와준다 유지보수 - 정리된 마크업은 코드 식별이 용이하다 / 논리적 순서 마크업 이란 ? 시멘틱 마크업과 함께 웹 문서의 뼈대가 되는 ..

WEB/HTML 2023.02.17
반응형