본문 바로가기

전체 글

(41)
저작권 무료 아이콘 사이트 Remix Icon 웹 퍼블을 하면서 수많은 아이콘과 이미지들을 정리하고 다루는 건 정말 귀찮은 일인 것 같습니다... 정리하는 걸 잘 못하는 저에게 있어서 아이콘과 이미지를 일일히 네이밍하고 분류하여 정리하는 건 javascript를 공부하는 것 보다 더 고역입니다. 그런 저에게 있어서 Remix Icon 사이트는 구세주나 다름없답니다! https://remixicon.com/ Remix Icon 사이트의 아이콘들은 모두 저작권 무료이므로 걱정없이 사용하셔도 됩니다. 해당 글에 따르면 자유롭게 사용해도 괜찮고 본인 프로젝트에 "Remix Icon"을 언급해주면 매우 고맙겠지만 필수는 아닙니다. 다만, 아이콘들을 판매해서는 안됩니다. 라고 적혀있습니다. 천사같은 분들이네요 >
[DAY 01] 홀수, 짝수 판별하기 - %로 나머지값 보기 문제 숫자를 매개 변수로 전달받아 짝수인지 홀수인지 판별하는 함수를 isODD 라는 이름으로 작성하고, 이 함수를 호출해 실행한 결과를 HTML 문서에 표시하세요 정수가 2로 나눠서 0이 나오면 : 짝수 정수가 2로 나눠서 1이 나오면 : 홀수
휴대폰 번호 입력 형식 - replace() 와 substring 휴대폰 입력 형식 1) 숫자 사이 '-' 자동기입 '-' 자동 기입은 되나 3자리 까지 입력시 '-''-' 두 개가 동시에 나옴 '-' 바는 000-0000-0000 처럼 순차적으로 나와야함 2) 글자 입력 불가 숫자입력 후 글자는 입력이 불가 최초 입력시 글자 기입이 가능 (tel의 pattern으로 인한 알람이 뜨기 때문에 큰 요소는 아님) 추후 코드 업그레이드가 필요
return 에 대한 js 초보의 야매정리 javascript를 공부하게 된 이후로 "return" 이란 개념은 너무나 이해하기 어려운 개념이었다. 그래서 내식대로 정리를 해봤다. 제대로 된 사용을 모르는 초보자의 정리이므로 괜히 따라 이해했다가 후회할 수 있으니 보실 분은 훑어 보시길 바라며.. return 은 어떤 일을 할까? 1. 값을 반환 (배출한다, 꺼내준다로 해석) (- 코딩 초보자로서 return을 검색하면 다 값을 반환한다는 표현을 사용하는데 항상 좀 더 풀어서 설명해줬으면 했었다..) var test = function (){ var x = 1; } test(); 이런식의 코드를 짰을 때 과연 무슨 일이 일어날까? 결론 :: 아무 일도 일어나지 않는다. 현재의 코드는 "x=1 인 자판기가 있기만 한 상태" 이다. (지역변수를 담은..
var, let, const 차이점 정리(링크) https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d javascript var, let, const 차이점 javascript var, let, const 차이점. GitHub Gist: instantly share code, notes, and snippets. gist.github.com var (function scope) - 전역에서 선언하면 전역에서 인식됨 - function name(){ 이 안에서 선언한 것은 이 안에서만 인식됨 } - $(function(){ 이 안에서 인식된 것도 이 안에서만 인식되어야 하는데 }) 전역에서도 인식되는 경우가 있음 var 로 선언하는 변수는 function 안에서 선언한 변수가 전역에서도 작동하..
선택한 색상으로 색 변하게 만드는 법(onclick, for, switch) 안녕하세요! 이번에 다루는 기능은 제가 예전에 만들었었는데 안타깝게도 적용되지 않은 기능이랍니다...ㅠㅠ 비록 쓰이지는 않았지만 블로그에 게시해서 공유해보고 싶었어요! ㅎㅎ 선택한 색상에 따라 대표 색상이 바뀌도록 만들었는데요! 여기서 사용한 대표적인 기능은! onclick="" html에서 태그에 적용하는 함수입니다. for(){} 증가문을 설정해줍니다 switch(){} 상황을 하나씩 설정해줍니다. (case1, case2....) 입니다 [1] 각 html 에 onclick(num, this) 를 먼저 설정해주고 [2] for 를 사용해 증가문을 설정해주고 (색상의 개수 이하로 증가되도록 설정) [3] 증가문의 수와 html의 onclick에 설정된 num이 같으면 [4] 각 넘버에 해당하는 색상이..
[scrollTop] 스크롤을 내리면 숨겨져있던 객체 등장! 스크롤 시, 숨겨진 객체가 등장하는 기능! 스크롤만 하면 뿅 등장하는게 재밌죠 (문과 감수성) 기능 소개에 앞서 살짝 헷갈릴 수 있으니 설명을 좀 달게요 스크롤 시 객체가 등장하는 기능은 일정 높이를 지났을 때, 숨겨진 객체를 등장시키는 개념이에요 그래서 처음 *^^* 가 적힌 객체의 높이를 먼저 구한 후, 윈도우 스크롤이 그 높이를 지났을 때 숨겨진 객체가 등장하는 거랍니다. 대표적으로 사용하는 기능입니다! $(객체).height(); 객체의 높이를 재줍니다. $(window).scroll(function(){}); 윈도우 스크롤 시 발생되는 기능 문법입니다. $(this).scrollTop(); 윈도우 스크롤 상단 수치라고 생각하시면 됩니다. (스크롤이 시작되는 지점은 0부터 시작합니다.) 작동원리 ..
클릭할 때마다 객체 추가하는 법(append, prepend) 버튼을 누를 때 마다 박스가 추가되는 기능! 뿅뿅뿅 하고 나타나는 박스들 좀 보세요~ 꺄올 여기에 쓰이는 대표기능은?? $(박스들이 추가되는 공간"부모").append(박스, HTML 형식으로 작성합니다.); 자매품 prepend 도 있습니다. (같은 형식으로 사용) (부모요소).append(추가할 자식요소); append, prepend 로 요소를 추가하는 기능은 부모요소에 적용하여 자녀를 늘리는 방식! append는 기존객체 뒤로 생성, prepend는 기존객체 앞에 생성 끝 감사합니다