I think, therefore I am.

<meta name = "viewport" content = "width=device-width;" charset = "utf-8" />

<script language = "javascript" type="text/javascript">

//[1] href속성 : 지정된 url로 이동

GoGo = function(){

location.href = "http://www.naver.com";

}

//[2] reload()메서드 : 현재 페이지 새로고침

function ReFresh(){

location.reload();

return true; //true를 반환하면, 버튼의 기능을 계속 실행 그렇지 않으면 이벤트 멈춤

}

//[3] 응용 : 3초 후에 지정된 URL로 이동하는 함수

function GoUrl(url){

window.setTimeout("location.href='" +url+"'", 3000);

}

</script>

<input type="button" value = "사이트로 이동" onclick = "GoGo();" />

<input type="button" value = "새로고침" onmouseover = "return ReFresh();" />

<input type = "button" value = "naver" onclick = "GoUrl('http://www.naver.com')" />

<meta name="viewport" content = "width=device-width;" charset = "utf-8" />

<script language = "javascript" type="text/javascript">

//[1] write()메서드 : 문서 영역에 문자열/데이터  출력

document.write("<hr />");

//[2] title속성 : 현재 문서의 <title>태그의 내용을 출력 또는 설정

document.title = "현재 예제는 document 객체 학습 중 ...";

document.write("현재 문서의 제목 : " +document.title+ "<br />");

//[3] lastModified 속성 : 현재 HTML문서가 마지막에 저장된 시간

document.write("현재 문서의 마지막 저장 시간 : " + document.lastModified+ "<br />");

//[4] 글꼴 색상 변경 관련 간단한 속성

ChangeColor = function(){                 //익명 메서드

document.bgColor = "silver"; //백그라운드 컬러

document.fgColor = "red"; //폰트컬러

}

</script>

<input type="button" value = "색상 변경" onclick="ChangeColor();" />

<meta name="viewport" content="width=device-width;" charset="utf-8" />

<script language = "javascript" type="text/javascript">

//[1]alert() : 경고 대화상자

window.alert("제일 많이 사용하는 웹브라우저 내장 객체");

//[2] confirm() : 확인 대화 상자

if(window.confirm("정말로 삭제하시겠습니까?")){

alert("삭제 되었습니다.");

}else{

alert("취소 되었습니다.");

}

//[3] open() : 새로운 창 열기(여러 옵션 알아보기)

function Myweb(){

window.open("http://www.naver.com", "naver", "width=500, height=500");

}

//[5] setTimeout() : 시간차 주기(크롬에선 안되나?)

window.setTimeout("alert('꽝!!!')", 3000);

//3초 후에 첫번째 매개 변수 명령어 실행

//[6] status 속성 : 상태표시줄(상태바)에 문자열 출력

function ShowMessage(){

window.status = "안녕하세요.";

//window.defaultStatus = "만나서 반갑습니다.";

}

ShowMessage(); //호출

</script>

<input type="button" value = "사이트 열기" onclick="Myweb();" />

<!--[4] close() : 현재 창 닫기-->

<input type="button" value = "현재 창 닫기" onclick="window.close();" />

<meta name="viewport" content="width=device-width;" charset="utf-8" />

<script language = "javascript" type = "text/javascript">

//3명의 국어점수를 입력받아서 총점과 평균을 구하는 프로그램

//input

//[1]첫번째 모양

/*

var kor = new Array(3);

kor[0] = 100;

kor[1] = 90;

kor[2] = 80;

*/

//[2]두번째 모양

//var kor = new Array(100, 90, 80);

//[3]세번째 모양

var kor = [100, 90, 85, 100, 90];

var total = 0;

var avg = 0.0;

//process

//total = kor[0] + kor[1] + kor[2]; 

for(var i=0; i<kor.length; i++){

total += kor[i];

}

avg = total/parseFloat(kor.length);

//output

document.write("총점 : "+total+"<br />");

document.write("평균 : "+avg + "<br />");

</script>

<meta name="viewport" content="width=device-width;" charset="utf-8" />

<script language = "javascript" type="text/javascript">

//정렬 : 데이터를 작은것에서 큰것순으로 정렬(오름차순) 또는 그반대(내림차순)

//오름차순 : 1,2,3 순으로 출력

//내림차순 : C, B, A순으로 출력

//Input

var sort = [33, 22, 11, 55, 44];

var temp = 0;

//Process : selection sort(선택정렬) 알고리즘

for(var i=0; i<sort.length-1; i++){

for(var j=i; j<sort.length; j++){

if(sort[i]>sort[j]){

temp = sort[i];

sort[i] = sort[j];

sort[j] = temp;

}

}

}

//Output

for(var i=0; i<sort.length; i++){

document.write(sort[i] + " ");

}

document.write("<br />");

</script>

<meta name="viewport" content="width=device-width;" charset="utf-8" />

<!--주어진 3개 또는 5개의 정수 중에서 최대값 또는 최소값을 구하는 알고리즘 예제 -->

<script language="javascript" type="text/javascript">

//Input

 var kor = [88, 99, 77, 66, 90]; //가장 큰 값 : 99

 var max = 0; //최대값이 저장될 변수는 해당 뎅터가 가질 수 있는 가장 작은값으로 초기화

 //Process : Max알고리즘

 for(var i=0; i<kor.length; i++){

if(max < kor[i]){

max = kor[i];

}

 }

 //Output

 document.write("최대값 : " + max+ "<br />");

</script>

<script language = "javascript" type="text/javascript">

//주어진 3개의 성적 중에서 가장 작은값을 출력

//Input

var math = [90, 100, 80]; //80점이 가장 작은값

var min= 100; //해당 데이터의 범위중 가장 큰값으로 초기화

//Process

for(var j=0; j<math.length; j++){

if(min > math[j]){

min = math[j];

}

}

//Output

document.write("최소값 : " +min+ "<br />");

</script>

$() 함수

우리가 작업하는 대상 객체를 만들어 내는, jQuery의 객체 생성 공장 같은 역할을 한다. jquery 객체는 여러개의 dom요소를 캡슐화할 수 있으며, 이것을 다양한 방식으로 다룰 수 있게 해준다.

.addClass() 메서드(<=> .removeClass())

선택한 페이지의 일부분에 CSS클래스를 적용하는 기능을 수행한다.

$(document).ready()메서드

수행시점과 상관없이 DOM이 로드되고 이미지가 로드되기 직전에 특정한 작업을 수행할 수 있다.

해당 함수는 한번만 호출되기 때문에 익명함수(anonymous function)<람다함수>기능을 사용하면 좀 더 최적화 시킬수 있다. jquery는 함수를 인자로 받는 메서드 들이 많기 때문에 이러한 표현 방식이 상당히 많이 사용된다.

이렇게 함수 내에 익명 함수를 정의하는 문법을 사용할 때, 클로저(closure)가 생성된다. 이것은 강력한 고급 기능이지만, 중첩 함수를 확장해서 사용하려는 경우 의도하지 않은 순서로 호출되거나 메모리 사용 문제가 발생할 수 있기 때문에 정확히 이해해 두는 것이 좋다.

Reference : jquery1.3 작고 강력한 자바스크립트 라이브러리(조나단 채퍼, 칼 스웨드버그)

jquery란 무엇인가?

jquery 라이브러리는 일반적인 웹 스크립팅에 폭넓게 사용될 수 있는 추상계층을 제공하므로, 스크립팅에서 필요로 하는 거의 모든 상황에 유용하게 활용할 수 있다.

2. 페이지가 보여지는 모습 변경하기 : 브라우저와 상관없이 동일한 표준을 제공하므로, 브라우저 간의 차이를 극복하도록 해준다. 또한 페이지가 렌더링된 후에도 클래스를 변경하거나 도큐먼트 일부분의 스타일을 개별적으로 바꿀 수 있도록 해준다.

3. 도큐먼트의 콘텐트 변경하기 : 간단한 코드로 외관 뿐만 아니라 도큐먼트 내용 자체를 API(Application Programming Interface)로 바꿀 수 있다.

4. 페이지와 사용자간 상호작용 처리 : jquery 라이브러리는 사용자의 링크 클릭등을 포함한 광범위한 이벤트를 가로채어 처리하는 세련된 방식을 제공하기에 브라우저간의 불일치 문제도 깔끔하게 처리해 준다.

5. 다큐먼트의 변화를 표시하는 애니메이션 추가하기 : 디자이너를 위해 효과 기능뿐만 아니라 새로운 효과를 만들 수 있는 툴킷을 제공하고 있다.

6. 페이지를 새로고침하지 않고 서버로 부터 정보를 가져오기 : 브라우저에 얽매이지 않는 AJAX(Asynchronous JavaScript And XML)기능을 제공하므로 개발자가 서버 측 기능에만집중할 수 있도록 해준다.

7. 일반적인 자바 스크립트 작업을 단순화 하기 : 자바스크립트의 확장기능이 추가로 제공된다.

1. || : 문자열연결

'abc' || 'def'는 'abcdef'이다.

2. ~~ : like

'xyzzy' ~~ '%zz%'

3. !~~ : not like

'xyzzy' !~~ '%aa%'

4. ~ : 정규표현식 하위 문자열 일치. 시작과 끝의 문자를 지정하기 위하여  ^와 $를 사용한다.

'xyzzy' ~ 'y.*y'

5. ~* : 정규표현식 일치, 대, 소문자 구별 안함

'xyzzy' ~ *'^x.*Y$'

6. !~ : 와 일치하지 않은 (~의 반대)

'xyzzy' !~' aa'

7. !~* : 와 일치하지 않은, 대,소문자 구별 안함(~*의 반대)

'xyzzy' !~* ' AA'

\copy 테이블 이름 from '파일이름' [using delimiters '구분자로 사용한 단일 문자'] [with null as 'null을 의미하는 문자열']

IS NULL : NULL인지 여부를 검사하는 질의어

COUNT(*) : 해당열의 총갯수를 구한다.

COUNT(열이름) : null을 제외한 갯수를 구한다.

MIN은 NULL값을 무시한다.