Ninny Design Skill/Javascript
-
Skill/JavascriptJS/jQuery - 스크롤 이벤트 : 맨 위, 맨 아래, 요소 위치 감지, 스크롤 업&다운스크롤 이벤트웹 페이지를 스크롤할 때 발생하는 이벤트. 마우스 휠을 사용하여 스크롤하거나 터치 기반 장치에서 스크롤 제스처를 사용할 때도 발생할 수 있다. 이벤트 핸들러를 사용하여 스크롤 이벤트를 감지하고, 사용자가 스크롤을 할 때 특정 동작을 수행할 수 있다.check_circle Check스크롤 이벤트내에 내용을 입력하면 스크롤이 발생할 때 마다 호출하기 때문에 이벤트를 한번만 호출해야 한다면 주의해야 한다. 스크롤 - 바닐라 스크립트window.addEventListener('scroll', function() { // 스크롤 이벤트가 발생할 때 실행될 작업 console.log('페이지가 스크롤됨!');}); 스크롤 - 제이쿼리$(selector).scroll(function() { ..reviews 1 calendar_month 2023.12.01
-
Skill/JavascriptJS/jQuery - 천단위(3자리수)마다 콤마 넣기 : toLocaleString(), replace()toLocaleString() 함수 toLocaleString() 메소드는 숫자를 통화 형식으로 표시하거나, 날짜와 시간을 로컬 시간대에 맞는 형식으로 표시해주기 때문에 toLocaleString() 메소드를 이용하여 숫자 3단위마다 콤마를 넣을 수 있다. wb_incandescent Tip toLocaleString()메소드는 현재 지역 설정에 따라 변환된 값을 반환한다. 따라서 결과는 각 사용자의 로컬 설정에 따라 다를 수 있다. 예시 var number = 123456789; console.log(number.toLocaleString()); // "123,456,789" // 인자없이 사용하면 사용자의 로컬 설정에 따라 반환 console.log(number.toLocaleString('ko-KR..reviews 1 calendar_month 2023.12.01
-
Skill/JavascriptJS/jQuery - 요소의 class 읽기, 추가, 변경, 제거, 포함 여부클래스 읽기바닐라스크립트const ex = document.getElementById('ex');// 클래스 이름 문자열로 리턴ex.className;ex.classList;ex.classList.length; // 클래스 갯수ex.classList.item(0); // 인덱스 0번째 클래스 이름ex.classList.item(1); // 인덱스 1번째 클래스 이름ex.classList.item(2); // 인덱스 2번째 클래스 이름className, classListelement의 클래스 이름을 문자열로 리턴classList.lengthelement의 클래스 갯수를 리턴classList.item(index)element의 특정 인덱스의 클래스 이름을 리턴 제이쿼리const ex = $('#ex');ex..reviews calendar_month 2023.10.23
-
Skill/JavascriptJS/jQuery - 현재페이지 url 가져오기 : window.location현재페이지 URLWindow.location은 읽기 전용 속성으로, 문서의 현재 위치(URL)에 대한 정보가 담긴 Location객체를 반환한다. 읽기 전용 형태이지만 문자열 할당이 가능하기 때문에 location을 문자열처럼 사용할 수 있다. 이 객체를 사용하여 브라우저의 주소 표시줄을 제어하고 페이지를 동적으로 변경할 수 있다.Location.href온전한 URL을 값으로 하는 DOMString. 바뀔 경우 연결된 문서도 새로운 페이지로 이동한다. 연결된 문서와 다른 오리진에서도 설정할 수 있다.Location.protocolURL의 프로토콜 부분을 값으로 하는 DOMString으로, 마지막의 ':'도 포함.Location.hostURL의 호스트 부분을 값으로 하는 DOMString으로, 호스트명, ..reviews calendar_month 2023.10.16
