본문 바로가기

프로그래밍언어/JavaScript13

director.js 새로고침 시 이슈 director.js 새로고침 시 이슈클라이언트-사이드 및 서버-사이드 URL 라우터인 director.js 를 사용하던 중, 브라우져에서 새로고침을 했을 경우 해시 라우트 정보가 반영되지 않던 이슈가 있었습니다. 태그에도 넣어보고 readyState 의 interactive, complate 에도 처리해보았지만 반영이 되질 않아, 검색해보니 해당 이슈는 많이 알려진 이슈였었습니다.해결법은 다음과 같습니다.: function initApp(e) { if (e.target.readyState === 'interactive') { var router = Router().init(); router.on('/page/:name', pageLoader); } if (e.target.readyState === 'c.. 2017. 7. 4.
[Javascript] 소수점 자리수 처리하기 [Javascript] 소수점 자리수 처리하기소수점 8자리 수끼리 합산을 했는데, 소수점 14자리가 나왔습니다.모든 수가 그런것이 아니라, 어느 시점에서 그렇게 변하였는데, 간단히 예제를 보자면:35.27387426 "+" 1.79806217 "=" 37.07193643 37.07193643 "+" 12.00537839 "=" 49.07731482 49.07731482 "+" 0.66331486 "=" 49.74062968 49.74062968 "+" 9.04520268 "=" 58.78583236 58.78583236 "+" 1.20602704 "=" 59.9918594 59.9918594 "+" 1.20602702 "=" 61.19788642 61.19788642 "+" 0.60301351 "=" 6.. 2017. 6. 28.
자바스크립트 날짜 비교, 이전, 이후 날짜 계산하기 자바스크립트 날짜 비교, 이전, 이후 날짜 계산하기 어느날 친구가 자바스크립트로 날짜 계산하고, 비교할 수 있는거 알려달라고 했습니다. 아이템 리스트들이 나오는데, 최근 3일 내에 아이템에는 NEW라는 아이콘이 뜨도록 하고 싶다고 하더군요.그래서 몇가지 예를 알려주었습니다. 특정 날짜 몇일 전후 계산하기 var today = new Date(); var prev_3day = new Date(); prev_3day.setDate(prev_3day.getDate() - 3); console.log(prev_3day); Tue Jan 10 2017 10:09:43 GMT+0900 (대한민국 표준시) var after_3day = new Date(); after_3day.setDate(after_3day.get.. 2017. 1. 13.
[응용] jQuery typed.js 와 visible plugin 어느날 jQuery의 type.js 를 이용해 문자열을 타이핑하는 효과를 주고 있었는데, 현재 화면에 나타났을 때, 타이핑 효과가 시작되도록 해달라는 요청이 들어왔다. 구글링해본 결과, jQuery 플러긴에 visible 이라는 확장 프로그램이 있어 이것을 응용해 해당 요청을 처리하였다. 준비물: 1. type.js (바로가기)2. visible.js (바로가기) 소스코드:마크업: 이 텍스트가 브라우져 화면에 노출되면, 타이핑 효과를 시작한다. 자바스크립트: var gClass = '.when-show-ani-typing'; $(gClass).find('p').hide(); var didScroll = false; $(window).scroll(function(e) { didScroll = true; }.. 2016. 11. 24.
[javascript] 클래스 속성 다루기 Element.classList (원문 바로가기) Element.classList는 읽기 전용 속성으로 DOMTokenList를 실시간으로 반영한다. (즉, 해당 속성 값을 변경하면, 재 표현된다.) classList를 사용하면 각각의 class 요소들에 접근 또는 편집을 할 수 있다. classList의 내용물은 element.className의 값을 공백(띄어쓰기)로 구분한 list 형식이다. Syntax var elementClasses = elementNodeReference.classList; elementClasses 는 elementNodeReference의 class 속성을 DOMTokenList로 재구성한 것이다. 만일 class 속성이 설정되어 있지 않거나, 비어있다면 elementCl.. 2016. 6. 22.
[javascript] 부모 엘리먼트(노드) parentElement or parentNode 특정 엘리먼트의 부모 엘리먼트를 가지고 있는 속성값이다. 이 속성값은 엘리먼트 마다 할당되어 있다. parentElement와 parentNode는 같은 기능을 하지만, 리턴값에서 약간 다르다. parentElement는 부모 노드가 없을 때 null 을 리턴하지만, parentNode는 Document node를 리턴한다. 예졔를 보면: ```javascriptdocument.body.parentNode; // Returns the element document.body.parentElement; // Returns the element document.documentElement.parentNode; // Returns the Document node.. 2016. 6. 22.