문자열(string)을 URL object로 사용하면 로케이션 오브젝트(Location Object)처럼 사용할 수 있습니다. (참고 : [javascript] 로케이션 오브젝트(Location Object)사용 하기 ) 'URL' 처리를 자동화할 수 있다는 것이죠 ㅎㅎㅎ 1. 객체 생성하기 로케이션 오브젝트를 생성하기 위해서는 'a'태그를 생성해야 합니다. 아래 코드와 같이 'a'태그를 생성한 후 주소(.href)를 설정해 주면 로케이션 오브젝트처럼 쓸 수 있습니다. var elemA = document.createElement('a'); elemA.href = "http://blog.danggun.net:8080/test/test.html?id=1111&test=22222#asdfasdf"; 이렇게 ..
자바스크립트(javascript)나 제이쿼리(jquery)에서 url을 다루기 위해서 로케이션 오브젝트(Location Object)라는 것을 사용해야 합니다. c#의 'url object(uri)'처럼 사용할 수 있습니다. 1. 프로퍼티 읽어오기 현재 url의 로케이션 오브젝트는 'window.location'를 읽어서 사용할 수 있습니다. 1 2 3 4 //javascript var objLocation = window.location; //jquery var objLocationJQ = $(location); cs 로케이션 오브젝트에서 받아올 수 있는 정보는 다음과 같습니다. hash : 앵커 부분(# 뒷부분) host : 호스트 정보(호스트 주소만 나옴) hostname : 호스트의 이름 href..
여러 가지 이유로 지정한 요소를 특정 태그로 감싸주어야 할 때가 필요합니다. 1. 제이쿼리(Jquery)를 이용한 방법 제이쿼리는 '.wrap()'함수가 있으므로 쉽습니다. //$([검색식]).wrap([추가할태그]); $('.interword').wrap(''); 2. 자바스크립트(javascript)를 이용하는 방법 자바스크립트는 살짝 힘듭니다. 요소를 찾아서 넣고 하는 작업이 필요하기 때문이죠 ㅎㅎㅎ //태그를 추가할 태그를 찾고 var div = document.getElementById('wrapMe'); //태그를 생성하고(여기선 'a') var link = document.createElement('a'); //기존 태그 내용을 추가해주고 link.innerHTML = div.outerHTM..
지정한 날짜에 날짜를 더하거나 빼는 계산을 하는 유틸리티입니다. 1. 설명 전역함수로 만들었습니다. 순수 자바스크립트만 사용하기 때문에 그냥 갔다가 쓰시면 됩니다. 자바스크립트의 날짜를 계산할때는 'setDate'와 'getDate'를 조합하지 않으면 원하는 결과값이 나오질 않습니다. 그런데 'setDate'를 하면 원본이 수정되기 때문에 여러작업을 할때는 값이 이상하게 나옵니다. 그래서 날짜를 계산하기 전에 원복을 복제(clone)하고 복제된 값을가지고 계산하는 방식으로 만들었습니다. 2. 코드 깃허브 링크 : DGUtil-JS(클릭) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 3..
클로우리 컴파일러 소개 goolge developers - Closure Compiler 구글에서 제공하는 자바스크립트 미니마이저 툴임 클로우저 컴파일러(Closure Compiler) 입니다. 바로가기 - Closure Compiler 웹에서 사용 가능합니다. 사용법은 간단합니다. 왼쪽 창에 코드를 넣고 컴파일(Compile) 버튼을 누르면 왼쪽에 결과가 나옵니다. 코드 넣는 곳에 위쪽에 있는 주석은 컴파일 옵션입니다. (참고 : Closure Compiler - Closure Compiler Compilation Levels ) 다 좋은데 웹 기반이라 로컬파일을 읽을 수 없다는거 ㅎㅎㅎ 파일을 여러 개로 만들었다면 수작업을 해야 합니다-_-;
예전에 C#과 다이랙트3d를 이용하여 2d 게임 프레임웍을 만든적이 있는데 거의 그 설계 그대로 자바스크립트로 구현하는 프로젝트 입니다. HTML5의 'canvas'태그를 이용합니다. 아직은 공개버전아니기 때문에 자세한 설명은 생략합니다 ㅎㅎㅎ 게임을 만들때 필요한 기능들을 미리 구현한 라이브러리라고 생각하시면 됩니다. 슬슬 문서화를 준비하고 있습니다. 지금 이 프레임웍을 이용하여 게임하나를 만들고 있는데....확실히 편하네요 ㅎㅎㅎ 다른 분들이 만든 것들에 비하면 형편없지만 말이죠;;;; 2013.10.31 - 0.61 TSF_Draw_Array 추가 : 드로우 메니저에서 배열로 관리되는 드로우객체를 출력할 수 있게 되었습니다. TSF_Draw_Sprite : 알파값이 무시되는 버그 수정
예전에 C#과 다이랙트3d를 이용하여 2d 게임 프레임웍을 만든적이 있는데 거의 그 설계 그대로 자바스크립트로 구현하는 프로젝트 입니다. HTML5의 'canvas'태그를 이용합니다. 아직은 공개버전아니기 때문에 자세한 설명은 생략합니다 ㅎㅎㅎ 게임을 만들때 필요한 기능들을 미리 구현한 라이브러리라고 생각하시면 됩니다. 2013.10.21 - 0.6 TSF_Resource : 리소스 처리 구조 변경 TSF_Draw : 코드 구조 개선(TSF_Draw_Image, TSF_Draw_Sprite, TSF_Draw_Text, TSF_Animation 로 분리 ) - 출력 오브젝트에 알파값을 적용할수 있게 구조가 변경되었습니다. 스프라이트 : 스프라이트 이미지 처리를 위한 'TSF_Draw_Sprite'추가 TS..
자바스크립트는 독특한 것들이 많은데 그중 하나가 연관배열입니다. 직접적으로 연관배열이 지원되는 언어는 많지 않은걸로 알고 있는데 말이죠 ㅎㅎㅎ (참고 : 위키백과 - 연관 배열) 1. 연관 배열 이란? 일반적으로 배열에 접근하기 위해서 인덱스(index, 첨자)를 이용하여 접근합니다. int nArray[10]; nArray[3] = 11; nArray[9] = 13; 이런 식입니다. 그런데 자바스크립에서는 위와 같은 일반적인 방법 이외에도 인덱스대신 문자열을 이용하여 접근 할수 있습니다. int nArray = new Array(10); nArray["Val01"] = 11; nArray["Val01"] = 13; 이렇게 말이죠. 이렇게 인덱스가 아닌 키로 배열에 접근하는 것을 연관배열이라고 합니다. ..
HTML5용 게임 프레임웍입니다. 예전에 C#과 다이랙트3d를 이용하여 2d 게임 프레임웍을 만든적이 있는데 거의 그 설계 그대로 자바스크립트로 구현하는 프로젝트 입니다. HTML5의 'canvas'태그를 이용합니다. 아직은 공개버전아니기 때문에 자세한 설명은 생략합니다 ㅎㅎㅎ 게임을 만들때 필요한 기능들을 미리 구현한 라이브러리라고 생각하시면 됩니다. 테스트용 게임(새창) 2013.09.30 - 0.5 게임루프 : 리소스 관리 : 리소스를 매모리에 적재하고 관리하는 기능입니다. 리소스를 그룹단위로 관리 할수 있습니다. 리소스 로딩도 처리합니다. 씬관리 : 게임의 장면을 관리하는 단위입니다. 그리기 관리 : 이미지를 계층으로 나누어 출력하는 기능입니다. 소리 관리 : 소리를 관리합니다. 타이머 관리 : ..
1. 문제의 발견 구글 Closure Compiler를 사용하다가 다음과 같은 오류가 났습니다. JSC_TRAILING_COMMA: Parse error. IE8 (and below) will parse trailing commas in array and object literals incorrectly. If you are targeting newer versions of JS, set the appropriate language_in option. at line 5 character 2 in HelloWorld.js BG: "background", ^ 앵? 번역을 해보니 자바스크립트에서 쉼표가 잘못되서 IE8에서 문제가 될 수 있다나 머라나;;; (대충 표준에 안 맞다는 소리입니다.) 2. 해결 방법..