[Javascript] - 1. 자바스크립트 기초

#자바스크립트 기초

 

 

#Document 객체

Document 객체는 웹 페이지 그 자체를 의미합니다.

웹 페이지에 존재하는 HTML 요소에 접근하고자 할 때는 반드시 Document 객체부터 시작해야 한다.

 

 

#자바스크립트 문법

<script>
    function todo(){
	var what = arguments[0];
			
	var modifyForm = document.getElementById("modifyForm");
	modifyForm.action = what + ".jsp";
			
	modifyForm.submit();
			
	}
</script>

-arguments[0] : 매개변수

-form id.action : 폼을 전송할 서버 쪽 스크립트 파일을 지정합니다.

-form id.submit() : 폼의 정보를 전송

 

 

#onclick

-클릭 시 발생하는 이벤트

 

 

#매개변수

function메서드는 arguments라는 배열을 가지고 있다.
// 매개변수가 없다고 해서 실제로 없는 것이 아님(자바스크립트는 선택사항)

<script>
  function select(num){ 
      alert("click : " + arguments[0]); 
  }
</script>  

 

 

#자바스크립트 변수

var키워드가 없으면 전역변수를 의미
var가 있으면 지역변수를 의미

 

 

#비교 연산자

==

-서로 다른 타입이면 강제로 형 변환해서 비교

===

-타입이 다르면 맞춰서 비교

 

 

#alert

-경고창

 

 

#자바스크립트에서 다른 페이지로 값을 넘겨주는 방법

 

1. location.href 사용

<tr onclick="select(<%=temp.getNum()%>)">
</tr>

<script>
 	function select(num){
 		location.href="readArticle.jsp?num=" + num;
 	}	
</script>

 

 

2. name값 사용-1

<tr onclick="select(<%=temp.getNum()%>)">
</tr>

<form id="hiddenForm" name="hiddenForm" action="readArticle.jsp">
	<input type="hidden" name="num" />
</form>

<script>
	function select(num){
 		var myForm = document.forms["hiddenForm"]
        myForm.num.value = num;
		myForm.submit();
	}	
</script>

 

 

3. name값 사용-2

<tr onclick="select(<%=temp.getNum()%>)">
</tr>

<form id="hiddenForm" name="hiddenForm" action="readArticle.jsp">
	<input type="hidden" name="num" />
</form>

<script>
	function select(num){
		var myForm = document.hiddenForm;
        myForm.num.value = num;
		myForm.submit();
	}	
</script>

 

 

4. id값 사용

<tr onclick="select(<%=temp.getNum()%>)">
</tr>

<form id="hiddenForm" name="hiddenForm" action="readArticle.jsp">
	<input type="hidden" name="num" />
</form>
<script>

	function select(num){
		var myForm = document.getElementById("hiddenForm");
		myForm.num.value = num;
		myForm.submit();
	}
</script>