전체 글365

• 

  JS (자바스크립트) 노드 CSS변경 노드CSS 변경하기 1. 노드의 css속성을 바꿀 때는 style속성을 이용한다 2. css의 속성은 카멜표기법을 따른다 3. 노드의 style에 전달되는 값은 문자열로 작성한다 규칙 노드.style.css속성 = 값 코드 더보기 목록1 목록2 목록3 속성변경하기 실습1 (quiz5) 코드 더보기 봄 여름 가을 겨울 실습2 (quiz06) 코드 더보기 onfocus - 인풋에 focus가 들어갈 때 동작, onblur - 인풋에 focus가 떠낫을 때 동작 아이디 : 비밀번호 : JS/JS (자바스크립트) ES5 2022. 12. 30.

• 

  JS (자바스크립트) BOM and DOM Browser Object Model (BOM) BOM은 브라우저 객체 모델이라 하여, 내장객체들을 의미한다. window, location, history, document 등이 포함된다. Document Object Model (DOM) DOM은 문서 객체 모델이라 하며, Document객체를 의미한다. DOM은 요소(element)의 선택 삭제 생성 등을 위해 사용한다. DOM객체를 이용한 요소의 접근은 자바스크립트의 중요한 기능이라 암기해야 한다. Element(태그) 노드 선택 QuerySelector() QuerySelector()는 name인 요소를 전부 선택한다. 버튼 java js css html QuerySelector() QuerySelector()는 요소 선택방법이 css와 동일하다.. JS/JS (자바스크립트) ES5 2022. 12. 29.

• 

  JS (자바스크립트) 이벤트 핸들러 이벤트 핸들러 ( Event Handler) 이벤트는 사용자의 동작이고 핸들러는 함수이다 화면에서 클릭이나, 동작시 발생하는 동적인 기능이다 자바스크립트의 첫번째 강력한 기능이다. 태그와 스크립트의 이벤트를 연결하는 방식에는 인라인 이벤트 모델, 기본 이벤트 모델, 표준 이벤트 모델이 있으며 이벤트 앞에 on을 붙인다. ※ : 자주쓰임 이벤트 종류 이벤트 종류 ※ click 마우스를 클릭했을 때 이벤트 발생 dbclick 마우스를 더블클릭했을 때 이벤트 발생 mouseover 마우스를 오버했을 때 이벤트 발생 mouseout 마우스를 아웃했을 때 이벤트 발생 mousedown 마우스를 눌렀을 때 이벤트 발생 mouseup 마우스를 떼었을 때 이벤트 발생 mousemove 마우스를 움직였을 때 이벤트 발생.. JS/JS (자바스크립트) ES5 2022. 12. 29.

• 

  JS (자바스크립트) JSON <->문자열 형변환 JS에서 서버랑 통신을 할때 JSON형식 데이터를 주고 받을때가 있다. 제이슨을 -> 문자열로 JSON.stringify(data); 문자열을 -> 제이슨으로 단, 이경우는 엄격한 형식을 지킨다(키, 값이 전부 “ “로 묶여야 한다) JSON.parse(문자열); 제이슨 -> 문자열 JSON.stringify(data); var data = [ { id : 'aaa123', title : 'aaa', content : '...'}, { id : 'bbb123', title : 'bbb', content : '...'}, { id : 'ccc123', title : 'ccc', content : '...'}, ]; // console.log(data); //JS객체를 JSON문자열로 형변환 var str .. JS/JS (자바스크립트) ES5 2022. 12. 29.

• 

  JS (자바스크립트) 객체 자바스크립트의 객체는 { }로 표기한다 자바스크립트의 객체는 함수로도 표기한다 두 가지 방법으로 객체에서 값을 가져올 수 있다. //객체의 표현 {} var person = {name : 'hong', age : 20, info:[1,2,3]}; console.log( typeof person ) console.log( person ) //객체의 접근방법은 2개 //1st -> 이름. 으로 접근 console.log( person.name ); // hong console.log( person.age ); // 20 console.log( person.info ); // [1, 2, 3] //객체의 표현 {} var person = {name : 'hong', age : 20, info:[1,2,3]};.. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  JS (자바스크립트) 렉시칼 스코프 & 클로저 렉시칼 스코프 함수의 스코프를 결정하는 방식이다. 함수의 선언위치에 따라서 사용가능한 스코프가 다르다. var a = 1; function x(){ a = 10; console.log(a); //10 } x(); var b = 1; function y(){ var b = 10; z(); } function z(){ console.log(b); } y(); 클로저 클로저는 함수와 함수가 선언된 어휘적 환경의 조합이다. 내부함수를 이용해서 외부함수의 변수에 접근할 수 있는 환경을 만들어 준다. function func1() { var a = 1; // var b = function(){ // return a; // } // return b; //줄이면 아래처럼 사용 가능 return function () {.. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  자바스크립트 함수(function) 자바스크립트에서 함수는 1급 최상위 함수이다. 객체지향 프로그래밍 언어에서 메서드의 기능보다 훨씬 더 많은 기능을 한다. 선언적 함수 -반환 유형은 적지 않으며 매개변수도 적지 않을 수 있습니다. -매개 변수는 데이터 타입을 적지 않습니다. -리턴은 적어도 되며 적지 않아도 상관없습니다. func1(); //호이스팅(선언적 함수에서 가능) function func1(){ console.log('func1실행'); } // var result = func2(); console.log(func2()); function func2(){ console.log('func2실행'); return 'func2반환'; } // var result2 = func3( 1, 2, 3 ); console.log(func3( .. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  자바스크립트 반복문 While문 //while문 var a=1; while(a JS/JS (자바스크립트) ES5 2022. 12. 28.

• 자바스크립트 조건문 조건문 if else switch 반복문 while do while for forin 탈출문 break continue 형변환 parseInt(값) -> 정수로의 형변환 parseFloat(값) -> 실수로의 형변환 var a = parseInt(Math.random() * 101); console.log(a); if (a >= 90) { console.log('90보다 큼'); } else if (a >= 80) { console.log('80보다 큼'); } else { console.log('80보다 작음'); } ifelse문 var num1 = 1; if (num1 >= 10) { console.log('10보다 큼'); } else { console.log('10보다 작음'); } Switch.. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  자바스크립트 배열 (Array) 배열 자바스크립트의 배열은 []로 묶어주기만 하면 된다. //배열을 조작하는 다양한 함수 //MDN var arr =[1,2,3,4,5]; console.log(arr); //배열 마지막에 추가 push() arr.push(6); console.log(arr); //배열 마지막 요소 제거 pop() arr.pop(); console.log(arr); //배열의 첫번째 요소 추가 unshift() arr.unshift(0); console.log(arr); //배열의 첫번째 요소 제거 shift() arr.shift(); console.log(arr); //배열의 첫번째 요소 추가 unshift() 배열을 통채로 넣는것도 가능함 arr.unshift([1,2]); //0번째 칸에 배열을 넣는다 consol.. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  자바스크립트 Basic 프로토타입 기반 객체지향 언어이다. 변수들의 타입에 있어서 차이를 두지 않는다. 특성상 플랫폼에 독립적이며 모든 웹 브라우저에서 동일한 실행결과를 얻을 수 있다. 스크립트 언어란? 어플리케이션이 실행되는 동안 라인 단위로 해석(인터프리터)되어 실행되는 언어. 별도의 컴파일 과정이 없다 html문서 내에서 스크립트 언어는 사이에 작성한다. 자바스크립트 사용가이드 사이트 https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide JavaScript 안내서 - JavaScript | MDN JavaScript 안내서에서 JavaScript 언어 개요와 사용법을 알아보세요. 언어 기능에 대해 상세한 정보가 필요하면 JavaScript 참고서를 방문하세요. devel.. JS/JS (자바스크립트) ES5 2022. 12. 28.

• 

  2022_12_08 Git 사용법 (git bash) 깃은 공통으로 관리하는 프로그램 소스코드를 관리하기 위한 플랫폼 사람들이 어디서나 프로젝트를 함께 할 수 있게 하기위해 사용 SVN은 git이랑 원리는 똑같다 git은 형상관리 프로그램의 일종이다. ->SVN의 단점을 보완해서 나옴 ---------------------------------------------- Git 다운로드 링크 더보기 https://git-scm.com/download/win (자리바꾸면 필수적으로 해야함) 깃 사용자 정보 설정 ->운영체제에 설정된 정보를 사용하기 때문에 컴퓨터가 바뀐다면 설정을 해줘야한다 구글 -> 깃 최초설정 검색하면 다 나와있음 Git 최초설정 참고사이트 더보기 https://git-scm.com/book/ko/v2/%EC%8B%9C%EC%9E%91%ED%.. 수정중 2022. 12. 27.