개발노트

일정시간 간격을 두고 function을 호출해야할 때가 있습니다. 일정 시간에 주기적으로 호출하려고한다면 setInterval() 메서드를 사용하고, 일정시간 뒤에 한번만 호출하길 원한다면 setTimeout() 메서드를 사용하면 됩니다. 1. setInterval(function, delay); 일정시간 간격으로 호출하기 function sayHello() { console.log('안녕하세요!'); } setInterval(sayHello, 1000); // 1초마다 sayHello 함수 호출 위의 코드에서 sayHello 함수는 1초마다 한 번씩 호출됩니다. 웹 브라우저의 개발자 도구 콘솔에는 '안녕하세요!'가 매 초마다 출력될 것입니다. clearInterval() 메소드로 타이머 취소하기 var..

fuction을 호출하기 위해서는 직접 소스에 작성하는 방법도 있지만, Event와 함께 사용하는 것이 일반적일 것입니다. 특정 요소에서 마우스 클릭이나 윈도우창에서 스크롤, 창크기 조정, 복사등 Event가 발생되면 들어주는 Listener가 필요합니다. 이와 같은 Listener를 추가하는 방법으로 addEventListener() 라는 메소드를 사용할 수 있습니다. index.html Click Me! app.js const title = document.querySelector(".main__title h1"); console.dir(title); function handleTitle() { title.style.color = "blue"; title.innerText = "OK"; } funct..

document 객체. document는 웹 페이지를 구성하는 HTML 문서를 나타내는 객체입니다. 웹 브라우저에서 HTML 문서가 로드되면, 브라우저는 문서를 파싱하여 document 객체를 생성합니다. 이 객체는 웹 페이지에 존재하는 HTML 태그, CSS 스타일, JavaScript 코드 등 모든 정보에 접근하고 조작할 수 있도록 합니다. document 객체는 HTML 문서의 모든 요소를 참조할 수 있습니다. 예를 들어, document.getElementById() 메서드를 사용하여 문서 내에 특정 ID를 가진 요소에 접근할 수 있습니다. 또한, document.getElementsByTagName() 메서드를 사용하여 문서 내에 특정 태그 이름을 가진 요소에 대한 참조를 가져올 수도 있습니다...

자바스크립트에서 함수는 코드 블록으로서 재사용 가능한 작업 단위를 정의하는 데 사용됩니다. 함수를 사용하면 코드를 모듈화하여 관리하기 쉽게 만들고, 코드의 가독성을 높이고, 코드의 재사용성을 높일 수 있습니다. 함수는 특정한 작업을 수행하거나 값을 반환하는 데 사용될 수 있습니다. 기본적인 Function 작성법. function addNumbers(a, b) { var sum = a + b; return sum; } var result = addNumbers(3, 5); console.log(result); // 8 출력 위 예제는 addNumbers 함수는 a와 b라는 두 개의 Parameter(매개 변수) 를 받고, 이를 더한 값을 Return 합니다. (함수를 통해 값을 다른 변수에 저장하고 싶다..

JavaScript에서 let, const, var는 변수를 선언하는 세 가지 키워드입니다. 이들은 변수를 선언하는 방법과 변수의 범위와 생명주기에 대한 동작에서 차이가 있습니다. 1. var var는 변수를 함수 범위(function scope)로 선언합니다. 함수 내에서 선언된 변수는 해당 함수에서만 접근할 수 있으며, 함수 외부에서는 접근할 수 없습니다. 변수가 선언되기 전에도 사용할 수 있습니다. 이를 변수 호이스팅(variable hoisting)이라고 합니다. var로 선언된 변수는 중복 선언이 가능하며, 동일한 이름의 변수를 여러 번 선언하면 나중에 선언한 값으로 덮어씁니다. 예시) function example() { var x = 10; if (true) { var x = 20; cons..

"Live Server"는 VSCode IDE를 사용하여 html, css, javascript 로 웹을 개발한다면, 필수적으로 사용하게 되는 확장 프로그램입니다. 매번 소스를 수정하고 디버깅할 때마다 실행되어있는 웹을 종료하고 F5 버튼을 눌러 디버깅을 다시 실행하여 적용화면을 보고계신다면, "Live Server"를 사용해주세요. "Live Server"는 VS Code 확장 프로그램으로, 소스 변경 후, 저장(Ctrl + S)으로 웹을 종료할 필요없이 실시간으로 적용이 가능합니다. 1. Ctrl + Shift + X 버튼 이나 Extensions 카테고리를 클릭하여 Live Server를 설치합니다. 2. VS Code 재실행 후, index.html 편집창 우클릭 > Open with Live S..

HTML HyperText Markup Language의 약자로, 웹 페이지의 구조와 콘텐츠를 정의합니다. HTML을 사용하여 제목, 단락, 목록, 링크 등의 요소를 생성할 수 있으며, 이러한 요소들은 웹 페이지의 구조를 결정합니다. 또한, HTML은 웹 페이지의 시맨틱 마크업을 가능하게 하여 검색 엔진 최적화(SEO)를 할 수 있도록 합니다. 파일은 .html 로 작성되어야합니다. 1. Tag (태그) Hello Googling Developer 꺾쇠 괄호 (angle brakets) 안에 형식을 나타내는 p, h1, h2, img 등을 작성하여 시작태그를 열어줍니다. 닫을 때는 슬래시를 형식 앞쪽에 입력하여 종료태그로 닫아줍니다. 콘텐츠 내용은 시작태그와 종료태그 사이에 작성해줍니다. *와 같이 종료..