✅Console로 문제해결하기 Javascript 코드가 실행되는 과정을 우리가 직접 눈으로 볼 수 없기 때문에 코드가 실행이 된 건지, 의도한 대로 진행되고 있는 건지, 함수가 잘 실행되고 있는 건지 등 의문점이 발생할 수 있다. 또한, Javascript 언어로 코딩을 하다 보면 다양한 문제를 직면하게 될 것이다. 그렇기 때문에 Javascript 코딩에서 console은 필수적이다. ➰console 띄우기 웹 개발을 하면서 사용할 console은 웹브라우저 개발자 도구의 console이다. chrome에서 f12를 누르거나 우 클릭을 하여 검사 탭을 클릭하고 우측 창에서 Console을 클릭하면 console 창이 뜬다. ➰console 사용법 - console.log() 예시 코드로 console..
✅오늘의 과제 ➰버튼을 누르면 연결된 텍스트가 변경되도록 하기 ➰코드 day3.html 김 민 선 ❓ ❔ ❓ day3.js let p = document.getElementsByTagName('p'); function changeText0() { p[0].innerHTML = "KIM"; } function changeText1() { p[1].innerHTML = "MAN"; } function changeText2() { p[2].innerHTML = "DU"; } 코드 설명 p 태그 3개에 한 글자씩 넣고, button 3개를 만들어 각각이 클릭될 때 연결된 함수가 실행되게 했다. 변수 p에 태그명이 p인 요소를 모두 배열의 원소로 넣어서 그 값의 innerHTML 내용을 바꾸는 함수를 3개 만들었..
✅HTML 속 Javascript(실제 코드 작성) JS 스터디 2일차에서는 Javascript와 html을 연동하는 2가지 방법을 알아보았다. 이번에는 실제 코드를 작성하면서 자세히 알아보도록 하자. 안녕하세요 ! 위의 코드를 실행하면 웹브라우저에 다음과 같은 화면이 나온다. 이제 "안녕하세요 !"라는 글씨를 "저는 만두🥟입니다"로 바꿔서 나타나게 해보자. 위의 html 파일과 같은 폴더에 Javascript 파일을 하나 새로 만든다. 그리고 그 파일에 아래와 같은 코드를 작성한다. let h1 = document.getElementsByTagName("h1"); h1[0].innerHTML = "저는 만두🥟입니다"; 이때 h1에는 태그명이 h1인 요소가 모두 저장되고 h1은 배열이 되므로 배열의 첫 ..
✅HTML 속 Javascript 자바스크립트(Javascript)는 웹 개발을 위한 프로그래밍 언어이며 html과 연동해 사용할 수 있다. 연동 방법에는 2가지가 있다. ➰1. html 파일에 script 태그 사용하기 첫 번째 방법은 html 파일에 script 태그를 삽입하는 것이다. 코드 예시는 다음과 같다. 위와 같이 script 태그로 Javascript 코드를 감싸주기만 하면 되므로 쉽다. 하지만 코드가 길고 복잡해지면 코드 수정 및 재사용이 어렵기 때문에 좋은 방법이라고 할 수 없다. ➰2. script src를 사용하여 링크 걸기 두 번째 방법은 Javascript 파일을 따로 만든 후에 html 파일에 그 링크를 연결해 주는 것이다. 코드 예시는 다음과 같다. 위와 같이 외부 스크립트 ..
✅자바스크립트란 ? 웹사이트를 방문했을 때 버튼을 누르거나, 이미지가 슬라이드 되거나, 글자가 움직이는 등의 효과를 본 적이 있을 것이다. 그러한 효과들을 만드는데 필요한 프로그래밍 언어가 javascript이다. javascript는 웹 개발에서 사용되는 유일한 프로그래밍 언어로 1995년에 개발된 언어이다. ➰자바(Java) VS 자바 스크립트(Javascript) 자바(Java)와 자바스크립트(Javascript)는 이름이 비슷하기 때문에 서로 관련 있는 프로그래밍 언어일 것이라고 생각하는 사람들이 많다. 객체지향 프로그래밍(OOP) 언어이고, 프론트엔드 개발, 백엔드 개발에 사용된다는 공통점이 있긴 하지만 두 언어는 완전히 다른 언어이다. 자바(Java)는 신용카드 프로그램, 안드로이드 애플리케이..
