html, css, Javacsript : 프론트엔드 웹 개발에 필요한 도구들Javascript: 프론트엔드와 백엔드 개발에 사용하는 프로그래밍 언어Front-end: 웹페이지에서 눈에 보이는 부분을 개발 ex)검색창, 게시판 등Back-end: 웹페이지에서 눈에 보이
에디터를 설치하고 3가지 이상의 태그를 포함한 HTML 파일 만들기 3가지 이상의 태그를 포함한 HTML 파일을 만들어 주세요. 아래 예시는 프로젝트를 통해 만들 챗봇입니다. 내코드
첫 번째 방법은 바로 html 파일 내부에 script 태그를 삽입하여 javascript 코드를 구현.위와 같이 javascript 코드를 script 태그로 감싸 줌.코드가 길어지고 복잡해지면 수정이 힘들고 재사용성이 좋지 않아 비추천!두 번째 방법은 javascr
js로 html 텍스트 변경 HTML JS
JS\`\`\`function 위(){ var p = document.getElementsByTagName('p') p0.innerHTML = "위코드"}function 코(){ var p = document.getElementsByTagName('p'
텍스트 문자로 실행의 결과를 확인'개발자 도구'를 확인f12 또는 우측 상단 설정 - 도구 더보기 - 개발자 도구HTMLjs위 코드는 console의 log를 통해 "Hello, World!"를 출력하겠다는 뜻js파일에서 선언한 변수가 어떤 값을 가지고 있는지 볼 수
✅ 퀴즈 : 버튼 클릭 이벤트 만들기console.log( ) 함수를 사용해, 버튼을 누르면 0부터 값이 증가하면서 출력되는 버튼을 만들어 보세요.HTMLJS
✅ 퀴즈 : 변수 타입 출력하기변수를 자유롭게 생성하고, 각 변수의 타입을 출력 해 보세요.
연산자 종류: 산술, 대입, 증감, 비교, 논리 산술 연산자 대입 연산자 증감 연산자 비교 연산자 논리 연산자
✅ 퀴즈 : 사칙연산 출력하기
조건문 : 경우의 수를 만들어 줌종류 : if-else문, swich문반복문: 프로그램을 실행하는 동안 동일한 실행문을 반복하도록 하는 문법종류: while, do/while, for
✅ 퀴즈 : 반복문과 조건문을 이용하여 간단한 스톱워치 만들기HTMLJS코드메이트 퀴즈에서는 setTimeout과 clearInterval으로 만들어보라고 하였지만,setInterval을 사용하여 만들어 보고싶었다.
함수의 정의 함수의 값 반환(return) 함수를 값으로 사용하기
✅ 퀴즈 : 전광판 만들기이번에는 자신의 아이디를 출력하는 전광판을 만들어 봅시다!버튼을 클릭할 때 마다 출력되는 글자가 하나씩 늘어나도록 코드를 구성 해 주세요.HTMLJS버튼을 클릭할 때 마다 출력되는 글자가 하나씩 늘어나고 색이 랜덤으로 변하게 설정함!
자바스크립트에는 다른 언어와는 다르게 객체라는 타입이 존재!개의 속성: 프로퍼티개: 객체이렇게 개의 속성이 바로 프로퍼티이며, 개 자체가 객체가 되는 것dog.name = "댕댕이"dog.age = 1dog.family = "치와와"코드로 구현\*함수를 통해 객체 생성
✅ 퀴즈 : 자신이 좋아하는 영화 정리하기이번엔 자신이 좋아하는 영화의 정보를 출력해보겠습니다.버튼을 눌렀을 때 객체로 저장된 영화의 정보를 출력하도록 코드를 구성 해 보세요.
버튼생성click_event로 설정하였으며, 사용자가 버튼을 몇 번 클릭하였는지 기억하기 위해 n이라는 변수를 선언하고, 초깃값을 0으로 설정onclick 에 함수를 연결자바스크립트를 통해 버튼에 클릭 이벤트를 추가setTimeout 함수를 사용하시면 매개변수로 넣은
✅ 퀴즈 : 이름과 전화번호 출력하기이번엔 전화걸기 버튼을 누르면, 2초 뒤에 이름과 전화번호를 출력하는 코드를 작성해 보세요.
✅ 오늘의 문제 : 나만의 챗봇을 만들기나만의 챗봇을 완성해보세요!
✅ 오늘의 문제 : 챗봇에게 말 가르치기챗봇에게 말을 가르치는 기능을 만들어 보세요!