전체 글(223)
-
[ JavaScript ] 버튼을 눌러 이미지의 크기 조절
환경 : Visual Studio Code [ 스타일 속성으로 폭, 너비를 주었을 경우의 전체 코드 ] 이미지 크기 조절 작게 보통 크게 [ 속성으로 폭, 너비를 주었을 때의 전체 코드 ] 이미지 크기 조절 작게 보통 크게 개인 공부 기록용입니다:)
2024.05.05 -
[ JavaScript ] 스크립트에서 폰트 조절하기
환경 : Visual Studio Code - 버튼을 활용하여 글자 크기를 조절해보자 [1] 작게 / 보통 / 크게 버튼으로 조절 폰트 크기 조절하기 작게 보통 크게 Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap ..
2024.05.05 -
[ JavaScript ] style 제어하기
환경 : Visual Studio Code - 글자의 색상 및 테두리 색상을 바꿔보며 style 제어를 이해해보자 [ 주요 코드 ] - 단순히 색상이 변하도록 구현해보기 (+) target 변수에 대한 스타일을 지정한다. (이렇게 사용하게 되는 경우 인라인 태그 전체 덮어쓰기가 되는 것이다. ) └ 단점 : 이후 코드의 확장성이 좋지 않음 - 단점 개선 (속성명까지 지정해주기) (+) target.style.color 까지 지정해주어 style의 특정 속성을 덮어쓰게 해준다. └ 해당 속성만 덮어씌워짐 - 위의 코드 차이를 느낄 수 있는 예시 - 테두리 효과를 주었을 때 (+) 만약 인라인 스타일 전체를 덮어쓰는 경우(첫 번째 코드 사용 시) 여러 버튼을 번갈아 눌렀을 때 제대로 적용되지 않는다. (글씨..
2024.05.04 -
[ JavaScript ] 지하철 요금 계산기 만들기
환경 : Visual Studio Code [ 주요 코드 ] (+) var inputValue = parseInt(inputTarget.value); //정수로 변환 └ (중요) inputTarget에 들어있는 값을 정수로 변환해주기!! (+) 조건을 줘서 각 조건에 맞는 금액을 출력하도록 설정하기 [ 전체 코드 ] 지하철 요금 계산기 요금 계산하기 지불하실 금액은 0원 개인 공부 기록용입니다:)
2024.05.03 -
[ JavaScript ] 입력 창의 정보를 읽어 출력하기
환경 : Visual Studio Code [ 주요 코드 ] - 입력창에 받은 내용을 p태그로 복사하기 입력 태그 제어하기 hello 저장 (+) var inputTarget = document.querySelector("[name=test1]"); 선택자의 태그 명을 생략하여 태그가 아닌 다른 입력 태그가 들어와도 사용 가능하게 구현. (+) 입력창(input, select, textarea)의 내용은 value 속성이다 (+) p태그의 내용은 textContent 속성이다 [ 전체 코드 ] 입력 태그 제어하기 hello 저장 개인 공부 기록용입니다:)
2024.05.02 -
[ JavaScript / React ] 리액트 연습
환경 : Visual Studio Code 이전글과 이어지는 연습 입니다 (참고 : https://ggingggang05.tistory.com/219) [ 실습 1 : 은행 이체 화면 문제 ] - Ex04.js //import import { useState } from "react"; //function function Ex04(){ const [money, setMoney] = useState(0); return( 은행 이체 화면 문제 원 setMoney(money + 1000000)}>100만 setMoney(money + 500000)}>50만 setMoney(money + 100000)}>10만 setMoney(money + 50000)}>5만 setMoney(money + 10000)}>1만 ..
2024.05.02