[JS] openweathermap api 날씨 아이콘 표시
2022. 1. 24. 14:40
공부/JavaScript
https://openweathermap.org/ 의 api를 이용하여 날씨 아이콘을 표시하려고 한다. 일단 기본적인 지역과 날씨 정보는 가져왔는데 아이콘은 어떻게 가져오나 많이 알아봤다. 그래도 내가 원하는 답은 딱히 나오지 않았는데 아마도 너무 당연하고 쉬운 일이라 그렇지 않았나 싶다. 일단 아래처럼 openweather api 안에 있는 data.weather.icon 데이터를 가져와야 했다. const iconData = data.weather[0].icon; 그리고 아래처럼 html에 준비해둔 img 태그에 .src로 url을 지정해주는데, 이때 미리 가져왔던 ${iconData}를 넣어준다. const icon = document.querySelector("#weathericon img").s..
[JS] 중첩 반복문, for문 (while, for)
2022. 1. 19. 20:16
공부/JavaScript
중첩 반복문 중첩 반복문 while을 이용하여 구구단 전체 출력하기 var dan=2 var i=1 while(dan
2진수, 8진수, 16진수
2022. 1. 19. 20:05
공부
2진수: 단위가 2씩 곱해지고, 0~1을 사용한다. 8진수: 단위가 8씩 곱해지고, 0~7을 사용한다. 10진수 8진수 7 7(1x7) 8 10 (1x8 + 0x1) 9 11 (1x8 + 1x1) 10 12 (1x8 + 2x1) 11 13 (1x8 + 3x1) ... 16 20 (2x8 + 0x1) 16진수: 단위가 16씩 곱해지고, 0~9까지는 숫자, 10~15부터는 문자를 사용한다. 10진수 16진수 1 1 2 2 ... 10 A 11 B ... 16 10 (1x16 + 0x1) 17 11 (1x16 + 1x1) ... 26 1A (1x16 + Ax1) 27 1B (1x16 + Bx1) ... 31 1F (1x16 + Fx1) 32 20 (2x16 + 0x1)
[JS] break, continue
2022. 1. 19. 19:37
공부/HTML, CSS
break : 반복문 탈출 continue : 반복문의 처음으로 BREAK : for(let i=1; i
[JS] 객체 내부에 함수 넣기
2022. 1. 18. 00:55
공부/JavaScript
객체 내부에 함수를 어떻게 넣는지 알아내기 위해 구글링을 하며 열심히 공부한 결과 key:value 형식이라고 한다. function hello () { //내용 }; 그러니까 일반적인 함수는 위와 같은데, 이걸 객체 내에 그대로 넣게 되면 에러가 발생한다. 해결 방법은 되게 간단했는데 방법은 아래와 같다. const hello = { hi: function () { //내용 }, hola: function () { //내용 } }; 위와 같이 key:value로 작성한다. 즉, function hello는 hello: function으로 바꿔주면 된다. 그리고 함수와 함수 사이엔 무조건 콤마(,)로 구분해야 한다. 이거 찾느라 30분 버렸다. 그렇다면 이제 객체 외부에서 사용해야 하는데 방법은 간단했다..
[JS] EventListener (click, mouseenter, mouseleave, contextmenu, resize)
2022. 1. 18. 00:36
공부/JavaScript
EventListener는 유저의 동작(event)을 감지한다. EventListener에는 여러가지가 있지만 제목에 있는 이벤트를 배웠으므로 정리하겠다. EventListener가 이벤트를 감지하면 정해둔 함수를 실행할 수 있다. CLICK "click"은 말 그대로 클릭 이벤트를 감지한다. hello.addEventListener("click", 함수); MOUSEENTER "mouseenter"는 커서가 요소 위에 올라오면 이벤트가 발생한다. hello.addEventListener("mouseenter", 함수); MOUSELEAVE "mouseleave"는 요소에서 커서가 떠나게 되면 이벤트가 발생한다. hello.addEventListener("mouseleave", 함수); CONTEXTME..
[JS] 증가, 감소 연산자
2022. 1. 15. 19:26
공부/JavaScript
증가 연산자 : ++ (1 증가) ++num : 선 증가 후 연산 num++ : 후 증가 선 연산 감소 연산자 : -- (1 감소) --num : 선 감소 후 연산 num-- : 후 감소 선 연산 let num1=10 let num2=10 document.write(num1, " ") //10 document.write(num1++, " ") //10 document.write(num1, " ") //11 document.write(" ") document.write(num2, " ") //10 document.write(++num2, " ") //11 document.write(num2, " ") //11
[JS] confirm
2022. 1. 15. 19:22
공부/JavaScript
confirm은 확인, 취소 선택 창이다. 확인을 누르면 true, 취소를 누르면 false가 반환된다. const result=confirm("계속 하시겠습니까?")
[JS] parseInt
2022. 1. 15. 19:20
공부/JavaScript
parseInt는 문자열을 정수로 바꾸어준다. let num1=prompt("정수1 입력") // "10" 입력 let num2=prompt("정수2 입력") // "20" 입력 const result=(num1+num2) //const result=("10"+"20") 이와같이 문자열로 입력됨. //const result="1020" 결과는 계산이 아닌 문자열이 합쳐지게 됨. 이 것을 해결하는 방법으로 parseInt를 사용한다. let num1 = prompt("정수1 입력") let num2 = prompt("정수2 입력") num1 = parseInt(num1) num2 = parseInt(num2) const result=(num1+num2 + num1+num2) document.write(re..