본문 바로가기

JavaScript

(2)
자바스크립트 9일차 - jquery burgermenu, header 이번 시간은 버거메뉴와 header에 대해서 알아보도록 하겠습니다. 버거메뉴란 아래 이미지처럼 생긴 메뉴로 클릭했을때 header든 메뉴든 뜨게 하는 아이콘 입니다. 해당 버튼을 만들어보도록 하겠습니다. 저 버튼을 누르게 되면 아래와 같이 모양이 x자로 바뀌면서 오른쪽의 메뉴가 호출될 수 있도록 만들 계획입니다. 먼저 오른쪽 메뉴부터 만들어보도록 하겠습니다. HOME WORKS ABOUT 그리고 article도 이렇게 만들어봅시다. 버거메뉴 자 이번시간은 css가 정말 많이 들어갈꺼에요 전에 스크립트부터 짜봅시다. 먼저 const를 통해서 각 트리거메뉴와 메뉴를 각각 이름을 지어줍시다. 그리고 클릭이벤트를 넣어줍니다. triggerMenu는 햄버거 버튼을 의미합니다. 이 버튼을 누를경우 togglecla..
자바스크립트 2일차 - 문자열 합치기 및 qeurySelector, innerhtml - 문자열 합치는 방법 - 여러 방법이 있지만 보통은 백틱을 이용한 변수, 문자열 합치기를 사용한다. 백틱은 우리 키보드자판의 좌측 상단에 있는 달러표시를 누르면 나오는 기호이다. `문자 ${변수}문자` 이런식으로 문자와 문자 사이에 변수를 넣을수 있다. ${ 변수명 } 을 백틱 안에 넣어준다. 자바스크립트를 사용하다 보면 html의 클래스 이름 및 태그를 가져와야 할때가 있다. 그럴경우 우리는 querySelector를 사용해 해당 내용을 가져온다. querySelector의 파라미터 표시 방법 클래스는 점으로 아이디는 샵으로 시작하고 태그는 태그명칭으로 시작한다. document. querySelector('div').innerText = 2000; 일일이 치기 힘들다. 그래서 변수에 담아둔다면 어떨..