alert : 메세지를 뛰워준다.
ex> <body onload="alert('Hello, I am your pet rock.');"> // 폐이지가 뜰때 메시지창을 뛰어서 알림 이건 바디가 실행될때 메세지를 띄우라는 말
onload : 웹 폐이지가 로딩을 끝냈다고 알려준다.
onclick : 마우스 클릭에 반응하는데 사용되는 자바스크립트 이벤트
3개의 기본 데이터 타입 : text , number, boolean
var 키워드는 변수를 생성할 때 사용되고, const는 상수를 생성할 때 생성
데이터 타입은 해당 데이터를 특정 값으로 설정할 때 확정되며, 변수의 경우에는 데이터 타입이 변경될 수 있다.
parseInt() , parseFloat() : 텍스트를 숫자로 변환하기
toFixed() : 소수점자리에서 반올림
ex> toFixed(2) : 소수점 두째자리에서 반올림
좋은 변수 코딩 습관
상수는 모두 대문자로, 변수들은 소문자낙타표기법으로..
isNaN() : 값이 숫자가 아닌지를 체크
타이머 : setTimeout ( 타이머 코드 , 타이머 시간 );
ex> setTimeout("alert('Wake up!');", 600000);
타이머의 반복적 실행 : setInterval();
코드의 구성은 타이머와 같다.
ex> val timerID = setInterval("alert('Wake up!');", 600000);
이런 주기적인 반복코드를 정지시킬려면 clearInterval(); 함수를 호출하여 정지시킨다.
ex> clearInterval(timerID);
클라이언트 윈도우 넓이 설정
document.body.clientHeight : 높이 설정
document.body.clientWidth : 가로 설정
쿠키 사용여부를 확인하는 함수
navigator.cookieEnabled
함수 : 문제를 해결하기 위해 쪼개는 단위
function + 함수명 + ( ) + {
함수 몸체
}
폼 데이터에 접근하기
ex> <input id="zipcode" name="zipcode" type="text" size="5" onclick="showIt(this.form)" />
접근은 아이디로 하고 값을 넘겨주는 폼의 값접근은 name속성을 사용하여 저장
function showIt(theForm) {
alert(theForm["zipcode"].value);
}
폼의 데이터 검사
onchange : 데이터의 폼에 값이 입력되었을때 확인
ex> <onchange="validateNonEmpty(this);" />
onblur : 데이터의 폼에 값이 변경이 안되어도 무조건 확인
ex> <onblur="validateNonEmpty(this);" />
정규 표현식 : / + 표현식 + / <= 슬러시 안에 표현한다. <== 데이터의 주고 받기나 서버에 데이터를 보내기 전에 폼에 들어간 값을 검사하기 위해서 존재한다.
. : newline이외의 어떤문자와도 일치한다.
\d : 메타문자는 역슬래시로 시작, 어떤숫자가 와도 일치
\w : 문자와 숫자가 결합된 어떤 문자가 와도 일치
\s : 공백문자와 일치
^ : 패턴의 시작을 알림
$ : 패턴의 끝을 알림
: 수량한정자
* : 선행 하위 패턴은 0번 혹은 그 이상 나타나야 한다.
+ : 선행 하위 패턴은 1번 혹은 그 이상 나타나야 한다.
? : 선행 하위 패턴은 0 혹은 1번만 나타나야 한다.
{n} : 선행 하위 패턴은 정확히 n번 나타나야 한다.
{min, max} : 최소에서 최대범위지정
{this|that} : 이것 아니면 저것을 선택할 수 있도록 한다.
ex> 2자리나 4자리만 입력하도록 한다.
/^(\d{2}|\d{4})$/
() : 그룹 문자는 메타문자와 함께 혹은 단일로 하위 패턴을 구성한다.
ex> /^\d{5}-\d{4}$/ : #####-#### 의 형태
[문자 클래스] : 긴 문자열의 폼을 컨트롤 하기 위해서 있는 형식..
기본 형식
<script language="javascript" src="파일명,js">
<!--
내용..
//-->
</script>
기본 출력
document.write("내용");
변수 기본형식
var 변수명 = 기본값;
팝업창의 기본 형식
window.open("새로 나타낼 파일명","윈도우이름","속성");
ex) function winOpen(){
mywin=window.open("b.html","new","width=250,height=300");
}
Document 속성, 이벤트 핸들러
<script language="javascript">
<!--
function myBackground(color){
document.bgcolor = color;
}
//-->
</script>
<a onmouseover = "document.bgcolor='pink'">분홍색배경</a>
홈폐이지등록 버튼형식과 이미지형식
1. <form>
<input type = "button" value="시작폐이지등록" onclick="this.style.behavior='url(#default#homepage)';
this.setHomePage('홈피로등록할주소');">
</form>
2. <a style="cursor:hand" hrefonClick="this.style.behavior='url(#default#homepage)';
this.setHomePage('홈피로등록할주소');">
<img src="시작이미지" border="0"></a>
'JavaScript' 카테고리의 다른 글
게시판 플젝에서 배운 기본 javascript (0) | 2011.04.05 |
---|