발생일: 2009.04.23 문제: prototypejs 를 이용해 Element의 순서를 바꾸려고 한다. Element.insert 구문을 사용하여 append 하려는 것이 아니라 원하는 위치에 넣고 싶은데... 해결책: Element.insert 구문을 사용하면 된다. (prototypejs 의 insert API) insert 구문은 append 기능 뿐만 아니라 동일한 레벨의 추가도 가능하다. (동일한 레벨의 추가에 대한 예제를 적어둔 블로그가 있다.) 예를 들어, 'sample' element 의 위치를 동일한 레벨에 있는 이전의 Element 앞으로 이동(자리바꿈)하고 싶다면, if (sample.previous()) { // 이전 element가 존재하면 // 이전 element의 앞에 sa..
프로토타입은~ 자바스크립트를 좀 쉽고 편하게 쓰기 위한 좋은 공통유틸(?) 정도로 생각하시면 될 것 같아요~ 특히 DOM(Document Object Model:div, input 같은 것들) 객체 접근이랑 AJAX에 매우 유용해요~~ 정식 명칭은 prototypejs 이고, 최신 버전은 1.6 버전이예요. 공식 사이트는 http://prototypejs.org 이구요~ API가 되게 잘 되어 있거든요~ http://prototypejs.org/api 에 가시면 JAVA API처럼 보실 수 있어요. (깔끔하니 보기 좋아요^^) 음~ 여기서는 객체 접근이랑 AJAX에 대한 부분, 간단한 유용한 함수에 대해서 소개해드리려구 하고요. 더 자세한 내용과 디테일한 사용법은 API를 참조하시면 될 것 같아요.^^ ..
출처: http://placebo4me.egloos.com/1062935 JSON은 무엇인가? JSON은 무엇인가? 경량의 데이타 교환 포맷이다. > XML과 비교한다. 간단한 포맷 > 사람들을 위해 읽고 쓰기가 쉽다. > 기계들을 위해 분석과 생성이 쉽다. JSON은 텍스트 포맷이다. > 언어에 독립적으로 프로그래밍된다. > 프로그래머들에게 잘 알려진 C,C++,C#,Java,JavaScript,Perl,Pyton을 포함하는 C와 유사한 언어로 모여서 사용된다. XML을 넘어 왜 JSON인가? on-the-wire(선을 통한) 데이타 포맷인 XML보다 가볍고 빠르다. JSON 오브젝트는 XML 데이타가 타입이 없는데 비해 타입을 가진다. > JSON types : string, number, array..
자바스크립트 정규식에서 그룹을 사용하려면 아래와 같이 하면 된다. 괄호 () 로 그룹을 만들어주고 RegExp.$그룹번호 와 같은 방식으로 접근하면 된다. 아래 코드에서는 패턴을 통과할 경우, 해당 값을 가져오도록 설정하였다~ var pattern = /(^]*?>)/i; if (pattern.test(html)) { var imgHtml = RegExp.$1; var imgId = RegExp.$2; var src = RegExp.$3; 쏼라쏼라~~ }
HTML DOM Location Object 를 이용해보자. Reference : http://w3schools.com/htmldom/dom_obj_location.asp Location 객체는 정확하게 DOM 객체라기 보다는 javascript 객체라 할 수 있다. 현재 URL의 호스트 정보 등을 가져올 수 있다. location.protocol : http: location.host : example.com location.pathname : test/sample location.search : ?id=123&name=test 이런 식으로 값을 얻어올 수 있다. js 파일에서 location 객체를 가지고 절대 경로로 호출할 필요가 있을 때에, "http://" + location.host + "/t..
스터디를 위한 코드잼 사이트를 만들다가 정답 파일을 업로드한 사람 순위를 실시간으로 보여주기로 했다. 스터디를 위한 보조 페이지인만큼 최대한 작은 공수로 해결하기 위해, 결과 페이지를 5초마다 AJAX로 가져와 각 문제에 대한 랭크 정보를 보여주는 방법을 썼다. 역시 최대한 작은 공수로 해결하기 위해 문제 풀이에 대한 결과는 디비 대신 파일을 사용하기로 했다. 결과 정보는 HashMap 와 같이 hashmap 에 문제 이름을 key 로, 정답을 맞춘 user 정보를 LinkedHashSet 에 담아 value 로 넣었다. (역시 간단 구현^^;;을 위해 로그인 프로세스 생성 대신 그냥 이름으로 중복 처리를 했다) 이 hashmap을 context 의 attribute 에 넣어 저장하고, 새 정보를 쓸 경..
자바스크립트에서 변수는 "", 숫자 0, NaN, Null, Undefined 일 경우에는 false 나머지는 모두 true를 표현합니다. 변수 a에 "20050919 Firefox/1.0.7"이 저장된다고 가정했을 때 a는 true가 되겠지요. 아래 샘플을 참조하세요 a1 = true && true // t && t returns true a2 = true && false // t && f returns false a3 = false && true // f && t returns false a4 = false && (3 == 4) // f && f returns false a5 = "Cat" && "Dog" // t && t returns Dog a6 = false && "Cat" // f && t r..
Instance Properties Instance Method Class Properties Class Methods function Rec(x, y) { //Instance Properties //모든 instance of Rec가 각각의 속성을 가진다 this.x = x; this.y = y; } //Instance Method //each instance does not have its own copy of Instance Method Rec.prototype.area = function() { return this.x * this.y; } * instance property와 instance method는 object의 instance에서만 접근할 수 있다. ex) rec1.x; rec1.are..
위의 간단한 코드가 실행되지 않는 이유. javascript가 document보다 먼저 읽히기 때문이다. 이를 해결하기 위해서는 1. script를 document의 맨 마지막에 추가하거나, 2. body tag에 onload를 사용해서 추가하거나, 3. window.onload를 사용하는 방법 ex) window.onload = function() { o.a(); } 4. 기타 방법, http://blog.naver.com/kolove79?Redirect=Log&logNo=20037499574 참조 [RE] Window.onload problem http://peter.michaux.ca/article/553
Javascript OOP 공부할 때의 메모. 다시 읽어도 여전히 @_@... === 자바스크립트 심화학습: 1. 상속: http://blog.naver.com/jinoxst/140021971146 2. 은닉: http://blog.naver.com/jinoxst/140022107416 3. 종합: http://blog.naver.com/jinoxst/140022149160 * 사용 중 알게된 것들. - 은닉을 사용해서 getter, setter를 만들 때, this.변수명 호출은 되지 않음. 예) function A() { var a; this.getA = function() { return a; return this.a; //이렇게 할 경우, 호출되지 않음. a는 A()의 지역변수이기 때문인 듯 } ..