Twinparadox Factory

console보통 디버깅을 위해 사용함. 변수 값 체크나, 에러 확인, 실행 경과 시간을 확인할 대 사용. console.time(레이블), console.timeEnd(레이블)같은 레이블을 가진 time과 timeEnd 사이에서 시간 측정. console.log(내용)로그를 콘솔에 표시. console.error(에러 메세지)에러를 콘솔에 표시. console.dir(객체, 옵션)객체를 콘솔에 표시할 때 사용. 첫 번째 인자로 표시할 객체를 넣고 두 번째 인자로 옵션을 넣음. depth는 객체 안의 객체를 몇 단계까지 보여줄 지 결정하며, 기본값 2. console.trace(레이블)에러 추적할 수 있게 해줌. 에러 발생 시점에 에러 위치가 나와서 흔히 사용하지는 않으나, 위치가 나오지 않을 때 사용...

커뮤니티, 쇼핑몰 같은 웹 사이트에서 회원가입을 하게 되면비밀번호를 확인하는 경우가 있다.자바스크립트를 활용하면 이를 간단하게 해결할 수 있다. 'password'와, 'pass1'을 입력한 상태. 두 칸 모두 'password'를 입력한 상태. 1234567891011121314151617181920function isSame() { var pw = document.twin.wUserPW.value; var confirmPW = document.twin.wUserPWConfirm.value; if (pw.length 16) { window.alert('비밀번호는 6글자 이상, 16글자 이하만 이용 가능합니다.'); document.getElementById('pw').value=document.getE..

Web] 마우스 온/오버 시, 투명도 바꾸기 텀 프로젝트 중에, 시각적인 효과를 고려하던 중, 투명도를 조정하여,아래처럼 마우스 포인터가 올려졌을 때 흐려졌다가,마우스 포인터가 해당 위치에서 떠나면 다시 원래대로 돌아오는 효과를 적용했다. 실제로 호스팅을 받는 사이트가 아닌지라,제품 사진은 다른 사이트에서 봤을 수도 있을 것..아무튼 각색하고, 이 기능은 아주 간단하게 구현이 가능하다.나는 저 프레임을 태그로 구성했는데, 소스는 다음과 같다 12345678function changeOpacity1(obj){ obj.style.opacity="0.5";}function changeOpacity2(obj){ obj.style.opacity="1";}cs 1234567 $name $price 원 Colored..

Web] Select 태그를 이용해 정렬하기 필자가 텀 프로젝트를 하면서,구매 내역 조회야 DB에 쿼리문 하나만 날리면 조회가 쉽게 이루어지지만,평가 기준에 별도의 기능이 추가되어 있어야 했고,당시 필자의 뇌리에 스쳤던 것은 구매 내역을 정렬하는 기능이었다. 인터넷에 있는 오픈 마켓에서 자기가 구매했던 내역을 특정일을 기준으로,혹은 특정 기간을 기준으로 정렬하는 것을 구현하는 기능을 흔하게 볼 수 있다.필자는 조회일을 기준으로 최근 1개월, 3개월, 6개월 기준으로 구매 내역을 조회하는 기능을 만들어보려고 했다. 소스와 이런 부분에 대해서 이야기를 나누기 전에 하나 짚고 넘어가야 할 점은,필자는 이전에 PHP를 해본 적도 없고, PHP의 버전이 어디쯤 왔는지까지 정확히 알지 못했다.(지금도 자세히는 모른..

### Browser Object Model ## Window Object - 브라우저의 내장 객체 중 최상위- 모든 전역 객체, 함수, 변수는 자동적으로 window 객체에 속함- 전역 변수(속성), 전역 함수(메서드)- window를 생략한 형태로 객체와 메서드 사용 가능- 공식 표준은 없으나 주요 브라우저들에서 지원- HTML5에서 브라우저 객체 모델을 공식 명세의 일부로 표준화시킴 # Open() 메서드- 주요 브라우저에서 지원함- 선택사항인 4개의 매개변수- URL : 새롭게 생성할 브라우저 창의 주소, 공백 시, 빈 브라우저 창- name : 새로 생성될 창의 이름 지정, form/anchor의 TARGET 속성을 위한 값- features : 창의 위치, 크기, 모양 지정, 일부 옵션은 IE..

### JavaScript Function - 객체 자료형 중 하나- 하나의 값처럼 취급해 변수에 할당 가능- C, Java와는 달리 함수 명은 선택사항이므로 함수명 없이 생성 가능(익명 함수) ## 익명함수 - function() {}와 같이 함수 형태이나, 이름이 없음- 이름이 없어 변수에 할당해 사용- 중괄호 안에 함수가 처리할 코드 기술- 함수의 재정의가 가능, 호출 시 최종적으로 할당된 함수가 호출됨 var 변수명 = function() {};의 형태 : 함수 표현식 ## 선언적함수 - 일반적으로 함수를 만드는 방식으로 함수명 존재- 익명 함수와 같이 중괄호 안에 함수가 처리할 코드 기술- 함수의 재정의가 가능함, 호출 시 최종적으로 할당된 함수가 호출됨 ## 익명함수 vs 선언적함수 1. 실행..

### JavaScript 내장 객체 - JavaScript 자체적으로 제공- Object : 최상위 객체, 모든 객체는 이를 기본으로 하여 생성- Number : 숫자 표현하는 객체- String : 문자열 표현하는 객체- 메서드 체이닝 : 메서드를 연속적으로 사용하는 것 ## Object - JavaScript의 가장 기본적인 내장 객체로, 최상위 객체- Object() 생성자 함수에 의해 생성된 인스턴스- 모든 기본 내장 객체는 Object 객체를 기본으로 만들어짐- 생성var object{};var object = new Object(); - 메서드constructor() : 객체의 생성자 함수를 나타냄hasOwnProperty(V) : 문자열 매개 변수로 전달된 속성이 객체에 있는지 확인isPr..

### 객체(Object) * JavaScript에서는 다른 객체지향 언어와 달리 클래스 없이 생성 가능* JavaScript는 이러한 이유로 객체 기반의 스크립트 언어로 불리고, 많은 부분이 객체로 존재해 매우 중요한 개념* 자기 자신이 가진 속성을 이용할 때, 반드시 this 키워드를 이용해야 함. JavaScript의 경우 생략 자체가 불가. - 변형 가능한 속성들의 집합- 이름과 값이 있는 속성들이 포함하는 컨테이너- 데이터를 모으고 구조화하는데 유용- 객체에 없는 속성값 접근 시, undefined 출력 Number, String, Boolean = 유사객체 Array, Function, 정규표현식 등 참조 타입이 객체인 것들 = 객체 ## 속성이름 - 빈 문자열을 포함해 어떤 문자열이나 숫자 ..

### JavaScript 내장 객체 - JavaScript 자체적으로 제공- Object : 최상위 객체, 모든 객체는 이를 기본으로 하여 생성- Number : 숫자 표현하는 객체- String : 문자열 표현하는 객체- 메서드 체이닝 : 메서드를 연속적으로 사용하는 것 ## Object - JavaScript의 가장 기본적인 내장 객체로, 최상위 객체- Object() 생성자 함수에 의해 생성된 인스턴스- 모든 기본 내장 객체는 Object 객체를 기본으로 만들어짐- 생성var object{};var object = new Object(); - 메서드constructor() : 객체의 생성자 함수를 나타냄hasOwnProperty(V) : 문자열 매개 변수로 전달된 속성이 객체에 있는지 확인isPr..

http://jsbeautifier.org/ 해당 사이트는 축소되어 가독성이 떨어지는 자바스크립트 소스를다시 가독성 좋게 변환해주는 사이트입니다.축소된 소스를 복사해서 붙여넣으면 Beautify를 눌러 읽기 좋게 변환 가능합니다.HTML소스도 가능하니 참고하시길 http://javascriptcompressor.com/ 해당사이트는 자바스크립트 소스를 축소하는데 사용합니다.저는 자바스크립트를 쓸 일이 없어 축소시킬 일이 있나 싶지만,오픈소스들을 뒤적거리다보면 축소된 소스들이 많이 눈에 띕니다.이것도 마찬가지로 복사해서 붙여넣고 Compress하면 축소가 진행됩니다.