반응형

보안상 사용자와 client의 상호작용이 없으면 적용되지 않음

function noBack() {
    history.pushState('preventLocation', document.title, '#');

    if (typeof window.addEventListener != 'undefined') {
	    window.addEventListener('popstate', clearHistory);
    } else if (typeof window.attachEvent != 'undefined') {
	    window.attachEvent('popstate', clearHistory);
    } else {
	    window.onpopstate = clearHistory;
    }
};

function clearHistory() {
    history.pushState('popstateFunction', document.title, '#');
};
반응형
저작자표시
반응형

  while문

while문은 조건이 참이면 일정한 처리를 계속 반복해서 실행합니다. 

 

  사용 방법

while(조건식) 문장

 

while문은 실행하면 가장 먼저 조건식을 확인하여

false면 다음 문장으로 이동,

true면 문장을 실행한 후 다시 조건식을 확인하며 반복합니다.

- while문 내에서 break를 만날경우 while문에서 빠져나옵니다.

- while문 내에서 continue를 만나면 while문의 시작 부분으로 되돌아갑니다.

 

  do/while문

while문은 시작 부분에서 조건을 확인한다면 do/while문은 반복을 마지막에 판단합니다.

 

  사용 방법

do 문장 while( 조건식 );

 

do/while 문 끝에는 세미콜론이 붙으며 조건식의 결과에 따라 반복/ 다음 문장으로 이동여부를 결정합니다.

- do/while문은 문장이 반드시 한 번 이상 실행됩니다.

 

 

반응형
저작자표시
반응형

Math 객체

메서드

설명

메서드

설명

Abs

절대값

Max

가장 큰 값

Acos

아크 코사인 값

Min

가장 작은 값

Asin

아크 사인 값

Pow

숫자의 배수

Atan

아크 탄젠트 값

Random

0~1사이의 임의의 수

Atan2

위치에 대한 각도

Round

반올림값

Ceil

지정된 실수에서 가장 가까운 정수를 가져온다.

Sin

사인값

Cos

코사인 값

Sqrt

스퀘어 루트 값

Floor

작거나 같은 숫자 중 가장 큰 값을 가져온다

Tan

탄젠트 값

Log

로그 값

 

 

 

Array 객체

종류

이름

설명

속성

Length

배열에 저장된 원소의 개수를 가져옴

Concat

여러 개의 배열을 하나의 배열로 합침

Join

배열의 각 원소를 하나의 문자열로 연결

메서드

Pop

배열의 가장 마지막 원소를 가져오고, 삭제

Push

배열의 마지막에 새로운 원소 추가

Reverse

배열의 원소를 역순으로 다시 정렬

Shift

배열의 가장 첫번째 원소를 가져오면서 삭제

slice

배열의 일부 원소만 따로 떼어냄

sort

배열외 원소 정렬

 

// Array 객체
<script language = "javascript">
  var arr= new Array;
  function push(){ //push 함수
    arr.push(document.getElementById("text1").value); //text1의 값을 배열에 push
    //text1 공백 할당
    pr(); //arr을 span에 출력
  }
  function pop(){ //pop 함수
    arr.pop();
    pr();
  }
  function shift(){ //shift 함수
    arr.shift();
    pr();
  }
  function reverse(){ //reverse 함수
    arr.reverse();
    pr();
  }
  function sort(){ //sort 함수
    arr.sort(sortNumberAsc);
    pr();
  }
  function pr(){
    document.getElementById("text1").value ="";
    document.getElementById("result").innerHTML = arr;
  }
  function sortNumberAsc(a,b){ 
    //a 와 b는 비교할 두 수 이며 a와 b를 빼준다
    //만약 연산 값이 음수가 나오면 b가 더 큰 수를 의미하며 순서는 a다음 b가 오게 됨
    //만약 연산 값이 양수가 나오면 a>b가 되므로 원래 sort가 동작하는대로 동작하게 됨
    //alert(a-b);
  return a-b; 
  }

</script>

 

숫자 객체(Number)

이름

설명

MAX_VALUE

표현 가능한 가장 큰 수

MIN_VALUE

표현 가능한 가장 작은 수

NaN

숫자가 아닌 경우의 표기

PUSITIVE_INFINITY

무한대 수의 표기

NEGATIVE_INFINITY

음의 무한대 수 표기

 

반응형
저작자표시
반응형

Java Script Html 엘리먼트 가져오기

var getEle = document.getByElementById("HTML Tag Id");

 

HTML BODY

// HTML body
<body>
	<input id = 'userid' type='text' maxlength='12' size='20'> 
    <input type="button" value="미리보기" onclick = "printText()">
	<br>
	색상:
	<select id = "textColor">
      <option value="red"> 빨강 </option>
      <option value="green"> 초록 </option>
      <option value="blud"> 파랑 </option>
	</select>
	<br>
	크기:
	<select id = "textPx">
      <option value="1"> 1 </option>
      <option value="2"> 2 </option>
      <option value="3"> 3 </option>
      <option value="4"> 4 </option>
      <option value="5"> 5 </option>
	</select>
	<br>
    <input type="checkbox" name ="line">취소선
    <input type="checkbox" name ="line">크게
    <input type="checkbox" name ="line">작게
    <input type="checkbox" name="line">두껍게
    <input type="checkbox" name ="line">기울임 
    <br>
    <input type="checkbox" name ="line">위첨자
    <input type="checkbox" name="line">아래첨자
    <input type="checkbox" name ="line">소문자로
    <input type="checkbox" name ="line" >대문자로
    <br>
	<span id="result"></span>
</body>

Script CODE

// getElementById("HTML ID");
<script language = "javascript">
  function printText(){
    var objid = document.getElementById("userid");
    var objtextColor = document.getElementById("textColor");
    var objtextPx = document.getElementById("textPx");
    var objresult = document.getElementById("result");
    var objtextOptions = document.getElementsByName("line");
    }
</script>

 

반응형
저작자표시
반응형

내장객체

사용자가 함수로 정의한것이 아닌 자바스크립트 내부에 존재하는 객체 

 

window.alert('메시지');  

html문서 작성자가 방문한 사용자에게 메시지를 보여주고자 할때 사용한다.

prompt 텍스트를 입력받을 때 사용

confirm(true/false)를 리턴 한다

window.open();

팝업 오픈

 

setTimeout(A, ms); //ms 후 A 실행

 

var inter = setInterver(A, ms); //ms 간격으로 A 실행

clearInterval(inter); // 해당 interver 종료

// interver
<script language = "javascript">
  var count =1;
  var inter = setInterval(say,1000);
  function say(){

  if(count ==6){
  	clearInterval(inter); <!--inter을 멈춤-->
  }
  	alert("hi "+count++);
  }
</script>

 

반응형
저작자표시
반응형

자바스크립트란?

html문서에서 html이나 CSS만으로 표현하기 어렵거나 아예 불가능한 작업을 하기 위해 만들어진 언어

스크립트 언어란 메모장 등 간단한 텍스트 편집기 프로그램을 이용해서 쉽고 빠르게 프로그램을 작성 할 수 있다

html문서에 직접 작성하거나 외부 파일에 작성된 후 불러올 수 있다

html에서 작성시 아래처럼 사용

 

<script>

    스크립트 작성 부분

</script>

 

 

기본 문법

변수

- 선언 var 변수명 =초기값

- var 배열명 = new Array();

- 배열명.push(1);

- 배열명[0] = 1;

 

함수

Function add(num1, num2){

return (num1 + num2);

}

Document.write(add(3,4));



출력

<!-- 출력 하기 -->
<html>
	<head>
		<script language = "javascript">
		var firstName = "도현";
		try{
		document.write('내 이름은 ' + lastName + '입니다');
		}catch(ex){
		document.write(ex.message);
		}
		
		</script>
	</head>
	<body>
	</body>
</html>
 
반응형
저작자표시

+ Recent posts

티스토리툴바