전체 글

1. 자바스크립트로 구현# p240530/react/ex01-javascript.html 상품 1 페이지 추가 🤍  기본 페이지기능 1. 좋아요 버튼 클릭시 하트 색 변경&이미지 추가된 모습 2. 자바스크립트를 리액트 JSX 문법으로 변환head 영역React 추가하기 위해 스크립트 태그 추가 !(https://ko.legacy.reactjs.org/docs/add-react-to-a-website.html) body 영역추가할 위치(element)..

1. 내장타입우선 자바스크립트에서 내장타입이라고 불리는 7가지 자료형이 존재한다.nullunderfinedbooleannumberstringsymbol(es6부터)object7가지 중 object 를 제외한 모든 값은 변경 불가능한 값(불변값) 이며, 이 6가지 자료형은 기본 자료형이라 한다 ! 2. 네이티브(native) native 는 다른 언어로 되어 있기 때문에 보여지지 않는다

JavaScript 1. 모달 띄우기 버튼 클릭 시 모달창 활성화, 모달창 닫기 버튼 클릭시 비활성화변수명에 element 저장const modal = document.querySelector('.modal');const overlay = document.querySelector('.overlay');const btn_modal = document.querySelector('#btn-modal');const btn_close = document.querySelector('.btn-close');const close_elements = [btn_close, overlay];https://print-blue.tistory.com/186 [Javascript] Element.classList 속성, 자바스크립..

console.log('>');console.log('null : ', Boolean(null));console.log('0 : ', Boolean(0));console.log('-5 : ', Boolean(-5));console.log('빈 배열 [] : ', Boolean([]));console.log('빈 객체 [] : ', Boolean({}));

웹 브라우저는 Application 에 web local storage 에 정보가 남아있는데, 여기서 가져올 것 ! 가져오는 함수가 있음 !단점 : 다른 웹 브라우저 사용시 보여지지 않음[저장하기 / 가져오기]localStorage.setItem(key, value);localStorage.setItem('문자열', '문자열');localStorage.getItem(key);localStorage.getItem('문자열'); 값 저장하기/가져오기// 1-1. 저장하기localStorage.setItem('name', '홍길동'); 확인해보면 개발자 도구에서 Application 에 Storage -> local storage 에 보면 저장된 값을 확인할 수 있다 !새로 고침해도 저장된 값이 지워지지 않는..

Element.classList 속성다양한 메서드를 통해 클래스를 간편하게 제어할 수 있다 !classList 자체는 읽기 전용 속성이지만 add() 와 remove() 메서드를 이용해 변형할 수 있다 ! 1. add()classList.add('클래스명') : 클래스 하나 추가classList.add('클래스명a', '클래스명b', '클래스명c',) : 클래스 여러개 추가2. remove()classList.remove('클래스명') : 클래스 하나 제거classList.remove('클래스명a', '클래스명b', '클래스명c',) : 클래스 여러개 제거

1. HTML 구조  행복한 마켓 모달창 띄우기 등록 태그로 넣을 것 --> 이메일 주소를 남기시면, 유익한 정보를 보내드립니다. × 뉴스레터 구독하기 이메일 주소를 남겨주시면, 행복한 마켓의 할인 혜택과 다양한 정보를 편하게 받아 보실 수 있습니다. 알뜰한 살림..

제목 1번째 단락 2번째 단락 3번째 단락  id 를 통해 append 에 content 로 h3 태그와 div 넣어준다고 할 때const append = document.getElementById('append');append.innerHTML = '추가된 제목추가 !'console.log('append.innerText >> ', append.innerText) 웹 브라우저 개발자 도구에서 소스탭에서 확인해보면 innerHTML 은 태그까지 다 들어오지만, innerText 는 text 만 ! 들어온다