본문 바로가기

분류 전체보기79

웹 브라우저에서 임시로 화면 변경하기 / 디자인 모드 Design Mode ? 개발자 도구(F12)를 통해서도 구성 요소를 스크립트로 제어하기보다는디자인 모드 Design Mode를 통해 웹 브라우저상에서 편집 자유롭게 가능합니다. document.designMode 는 전체 document의 편집 가능 여부를 제어합니다. 유효한 값은 "on"과 "off" var mode = document.designMode; document.designMode = "on"; document.designMode = "off"; Document.designMode - Web API | MDN document.designMode는 전체 document의 편집 가능 여부를 제어합니다. 유효한 값은 "on" 과 "off" 입니다. 명세에 따르면, 이 속성은 기본적으로 "off"로 설정되어 있습니다. F.. 2022. 7. 18.
[ es6 ] if문 중첩 / 렛츠기릿 자바스크립트 인프런에서 렛츠기릿 자바스크립트가 무료 강의로 오픈되면서 자바스크립트 기초를 다시 다져야겠다는 생각으로 강의를 들었는데 기초부터 잘 알려주는 강의입니다. 평소 자바스크립트하더라도 헷갈렸던 부분들이 많이 생기기 마련인데 왜 이렇게 작동되는지에 대한 원리 또는 코드 작성 시, 스킬등 꿀팁들을 다양하게 알려주셔서 궁금증 해소가 많이 되는 강좌였고, 계속 진행예정입니다. 4강. if문 중첩 줄이기 const onClickNumber = ( event ) => { // 연산자가 비어 있지 않고, numTwo의 값이 없다면 if (operator) { // 비어있지 않다 if(!numTwo) { $result.value = ''; } numTwo += evnet.target.textContent; } else { .. 2022. 7. 13.
[테스트] 크롬 개발자 도구 활용편 - 소소한 기능들 개발자 도구의 툴 검색 단축키 Ctrl + Shift + P screenshot 풀사이즈 스크린 샷, 노드단위 스크린샷, 부분 스크린샷등을 개발자도구에서도 지원해줌 Coverage : 이 페이지 렌더링에 사용중인 CSS, JS 파일을 알려줌 사용 비율과 사용되지 않고 있는 비율까지 체크해줌 사용 안되고 있는 부분들은 빨간색으로 체크해줌 로딩시간을 많이 잡아먹는 코드들을 줄일 때 유용할 것 같음. FPS meter 컴퓨터 프레임을 측정할 수 있음 컴퓨에서 프레임은 초당 정지사진(멈춰있는 하나의 사진)이 등장하는 횟수. ex) 60프레임이라고 하면 1초에 60장의 사진이 움직임 -> 프레임이라는 단위는 정지사진 1개를 의미 GPU메모리까지도 알려줌 AdBlock 시뮬레이션 광고없는 화면 표기도 가능 ads .. 2022. 4. 20.
[ JS ] params 쿼리스트링 문자열 추출 방법 URL의 쿼리 스트링 문자열 정의 - 쿼리 스트링 추출하여 해당 탭메뉴 구현 - 쿼리 스트링 값에 따른 페이지 이동 등을 다양하게 활용 가능함. params 추출 결과 화면 method URLSearchParams() URLSearchParams 객체 인스턴스를 반환합니다. URLSearchParams.append() 특정 키/값을 새로운 검색 매개변수로 추가합니다. URLSearchParams.delete() 특정 매개변수를 찾아 키와 값 모두 지웁니다. URLSearchParams.entries() 객체의 모든 키/값 쌍을 순회할 수 있는 순회기를 반환합니다. URLSearchParams.forEach() 객체의 모든 값을 순회하며 지정한 콜백을 호출합니다. URLSearchParams.get() 주.. 2022. 2. 18.