JQuery 스타일과 명명 규칙

Web/JQuery 2012. 7. 4. 13:44 Posted by Request

jQuery는 체인으로 연결되는 것을 매우 중요하게 생각한다.

즉. 체인으로 연결이 가능하다는 말은 요소의 선택 집합에서 순차적으로 메서드들을 호출하는 경우 각각의 메서드가 계속적으로 작업할수 있도록 요소의 선택 집합을 다시 여러분에게 반환할 것이라는 것을 의미한다.

 

jQuery의 기능들은 간단한 카테고리로 구성되어 있는데, 예를 들면

 

핵심 기능, 선택, 조작, 탐색, css, 어트리뷰트, 이벤트, 효과, Ajax 그리고 유틸리티등이 그러한 카테고리의 예이다.

 

 

1)반복적으로 동일한 선택 집합

2)변수에 선택 집합을 저장하는 방식.

 

변수에 선택 집합을 저장하는 경우는 jQuery 개체임을 나타내기 위해서 변수명을

$ 문자로 시작되는 선택집합 관련 이름으로 구성하는 것이 좋다.

 

$문자로 시작하는 것은 단지 명명 규칙에 불과하다는 것을 기억해두자!

 

 

 

 

getAttribute 란?

Web/JavaScript 2012. 6. 27. 18:26 Posted by Request

getAttribute 는 특정 요소노드 내에서 특정 한 속성값을 가져오는 메소드이다.

 

var para = document.getElementById("홍길동");

var title = para.getAttribute("title");

 

위의 소스를 보면

첫 번째 줄에는 "홍길동"이라는 id를 가진 요소노드를 불러와 para라는 객체를 만들어 저장하고,

두 번째 줄에는 para내 객체에서 "title"이라는 속성노드의 값을 title이라는 변수에 저장하는 것이다.

 

 

function ex2(){

var paras = document.getElementsByTagName("ul");

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

alert(paras[i].getAttribute("id"));

}

}

window.onload=ex2;

 

소스 설명을 하자면 문서내에서 <ul> 태그들을 불러와 paras라는 변수에 저장하고 (만약 <ul>태그가 여러개면 paras는 1차원 배열 변수가 될것이다.

 

그렇게 생성된 paras[0,1,2...]라는 객체 변수들이 가진 속성노드 중 id가 가진 속성값을 for문을 이용해

대화상자를 띄워 출력시키라는 소스이다.

(<ul>태그가 여러개라면 대화상자가 갯수만큼 차례로 뜨게 도리 것이다.)

 

 

getElementsByTagName

Web/JavaScript 2012. 6. 27. 17:21 Posted by Request

getElementsByTagName은

 

getElementById 와 마찬가지로 요소노드에 접근하는 메소드이다.

 

다만 id명을 통해 접근하는 것이 아닌 요소노드의 태그명으로 접근하는 것이다.

 

var items = document.getElementsByTagName("li");

 

라고 하면 문서내의 <li>태그들을 모두 불러와 items이라는 변수에 저장하게 된다.

 

items 라는 변수는 물론 객체변수이고 만약에 문서내 <li>태그들이 여러개면 items라는 변수는 1차원배열이 된다.

 

(items[0], items[1], items[2]... 이런 식으로 )

 

그렇기 때문에 위에 메소드명을 보면 eleements라고 복수형으로 쓰여 있는 것 알수 있다.

 

<script>

function ex(){

var items = document.getElementsByTagName("li");

alert(items.length);

window.onload = ex ;
}

</script>

 

문서내 <li>태그들을 모두 불러와 items라는 1차원 배열 객체형 변수를 생성해 저장하고 alert(items.length)에서 변수의 길이가 몇인지 대화상자를 띄워서 출력하라는 것이다.

배열변수의 길이는 곧 문서내 <li>태그의 갯수이다.

 

출처  : http://blog.naver.com/rusdudtn2?Redirect=Log&logNo=140047888495

getElementById 란?

Web/JavaScript 2012. 6. 27. 16:59 Posted by Request

DOM의 메소드는 보통 이름을 보면 메소드의 특징을 잘 알수 있다.

 

var ultra = document.getElementById(utram);

라고 한다면 문서 내에서 ultram라는 id를 가진 element를 불러와서

ultra라는 객체에 저장시킨다는 뜻이다.

 

이처럼 getElementById는 특정 아이디의 요소 노드에 직접 접근 할수 있는 메소드이다.

자바스크립트는 대소문자를 구분하기 때문에 사용할 때 대소문자 구분에 주의하여야 한다.

 

아래 예시를 보자.

 

<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

<title></title>

<script>

var pur = document.getElementById("purchases");

alert(typeof pur);

</script>

</head>

<body>

<p title="i don't Know">can you listen to me?</p>

<ul id="purchases">

<li>chew</li>

<li>milk</li>

<li>water</li>

</ul>

</body>

</html>

 

purchases라는 id명을 가진 요소노드를 불러와 pur 객체를 만든다.

그리고 alert(typeof pur); 에서 typeof 는 pur 라는 객체의 type을 가르키는 것이다.

 

pur 는 객체이므로 object라는 대화상자가 뜨게 될 것이다.

 

출처 : http://blog.naver.com/rusdudtn2?Redirect=Log&logNo=140047888495

 

 

노드란 무엇인가?

Web/JavaScript 2012. 6. 27. 16:39 Posted by Request

노드란 네트워크에서 특정 지점을 가리키는 말입니다.

 

 

그림을 보면 좀 이해가 가실 것입니다.

 

DOM에서도 비슷합니다.

문서는 곧 노드의 집합이고 문서라는 나무 위에 가지는 링크고 잎사귀는 곧 노드가 되는 것입니다.

 

노드에는 다양한 형식이 있는데, 요소노드와 텍스트 노드와 속성 노드가 있습니다.

 

1)요소 노드

 -태그나 element라고 하는 것들입니다.

 

<body><head><p><ul><h1>이런것들이 바로 요소 노드가 된다.</head></body>

 

요소노드들 끼리는 서로 포함 관계를 많이 갖게 되는데

다른 요소에 포함되지 않는 유일한 요소노드는 <HTML>이 된다.

 

2)텍스트 노드

웹문서에는 내용이 들어 있고 대부분의 내용은 텍스트로 제공 할수 있다.

이것이 바로 텍스트 노드이다.

<p>U've got a minute?</p>

 

라는 부분에서 U've got a minute?이라는 부분이 텍스트 노드가 됩니다.

XHTML에서 이 텍스트 노드는 보통 요소 노드 안에 포함되게 됩니다.

 

 

3)속성 노드

-요소노드의 태그안에 있다.

 

<p title="nodeName">U Can do it</p>

 

위의 소스에서 보면 p라는 요소 노드가 있고 <p></p>사이에 U Can do it이라는 텍스트 노드가 있는 것이 보인다.

p라는 요소 노드내에 보면 title이라고 되어 있는데 이것이 바로 속성 노드이다.

속성 노드는 항상 요소노드 태그 내에 포함되어 있다.

 

 

출처 : http://blog.naver.com/rusdudtn2?Redirect=Log&logNo=140047888495

java.lang.IllegalStateException

Program_Language/Java 2012. 6. 25. 10:57 Posted by Request

java.lang.IllegalStateException:저 익셉션은 forward나 redirect를 하기전에.. out.println() 또는 response.setHeader(..)와 같은 함수를 호출해서 발생합니다.

 

즉 브라우져에 보낼 데이터를 버퍼에 쓴 이후로는 redirect나 forward를 할수 없다는 말입니다.


발생한 jsp에서 위와 같은 사항이 없는지 살펴보시길..


디버그 모드에서 값을 확인해도 문제가 된다.

즉, response로 오는 inputStream값에 영향을 주는 요소가 생기기 때문에 말생한다.

참고 : http://okjsp.pe.kr/seq/32250

 

web.xml 에 대한 구조 이해

Web/JSP 2012. 6. 20. 15:43 Posted by Request

web.xml은 xml파일이다. 따라서 xml 작성과 동일한 규칙이 적용된다.
환경설정은 <web-app>으로 시작하고 </web-app>로 끝난다. 그외 삽입되는 요소로는 다음과 같다.

.ServletContext Init Parameters
.Session Configuration
.Servlet/JSP Definitions
.Servlet/JSP Mappings
.Mime Type Mappings
.Welcom File list
.Error Pages

 

 

web.xml의 elements의 순서
각 element의 순서는 아래 순서에 따른다.

<icon?>,
<display-name?>,
<description?>,
<distributable?>,
<context-param*>,
<filter*>,
<filter-mapping*>,
<listener*>,
<servlet*>,
<servlet-mapping*>,
<session-config?>,
<mime-mapping*>,
<welcome-file-list?>,
<error-page*>,
<taglib*>,
<resource-env-ref*>,
<resource-ref*>,
<security-constraint*>,
<login-config?>,
<security-role*>,
<env-entry*>,
<ejb-ref*>,
<ejb-local-ref*>

 

 

 

<display-name>어플리케이션 이름</display-name>

<description>어플리케이션 설명</desciption>

 

<!--서블릿 매핑 클래스 설정-->

<servlet>

<servlet-name>BoardFrontController</servlet-name>    //클래스명

<servlet-class>kr.co.board.controller.BoardFrontController</servlet-class>  //클래스경로+클래스명

<load-on-startup>1</load-on-startup> //서블릿주기 init()메소드의 실행 시 서버스타트 우선권

//init()메소드는 한번 호출되면 차 후에는 destroy()될때까지 그안에 있는 로직이 메모리에 정적 저장

</servlet>

 

<!--서블릿 매핑 설정-->

<servlet-mapping>

<servlet-name>BoardFrontController</servlet-name>

<url-pattern>*.do</url-pattern>

</servlet-mapping>

 

<!--JDBC 매핑-->

<resource-ref>

<description>Connection</description>

<res-ref-name>jdbc/OracleDB</res-ref-name>

<res-type>javax.sql.DataSource</res-type>

<res-auth>Container</res-auth>

</resource-ref>

 

<!--존재 하지 않는 경로(404) 에러 페이지 설정 -->

<error-page>

<error-code>404</error-code>

<location>/error.jsp</location>

</error-page>

 

<!-- 태그 라이브러리 설정 -->

<taglib>

<taglib-uri>taglibs</taglib-uri>

<taglib-location>/WEB-INF/taglibs-cacahe.tld</taglib-location>

</taglib>

 

출처 : http://blog.daum.net/revolo/3368937 내용 정리

setContentType

Web/JSP 2012. 6. 13. 15:25 Posted by Request

setContentType

 

1) 형식 : setContentType(문자 Type)

2) 설명 : HTTP 헤더 부분의 Content-Type을 정의합니다.

 

(1)type은 MIME-type을 의미합니다.

(2) Server에 있는 Ditto가 실행 결과를 브라우저로 Output할때, HTML 브라우저로 전송하는 정보를 다루기 위한 함수 입니다.

 

(3) 웹서버가 클라이언트에서 요청한 결과를 전송 할때 보내지는 정보는, 크게 우리의 눈에는 보이지 않는 Header 부분과 실제 브라우저를 통해 사용자에게 보여지게 될 Content 부분으로 나뉘어 집니다.

Header 부분에는 여러 가지 정보를 (Stauts, Content-Type, Location, Connection 등) 포함 되어 있는데, 이 중 Content-Type은 사용자가 보게 될 Content 부분의 종류가 무엇인지를 정의합니다.

마찬가지로 그 처리 결과를 브라우저로 내 보낼 때, TEXT로 보낼 것인지, HTML 형태로 보낼 것인지 아니면 GIF그림 파일로 보낼 것인지와 같은 Content-Type을 결정해 주어야 합니다.

 

HTML로 출력시 : setContentType("text/html");

일반 TEXT로 출력시 : setContentType("text/plain");

이미지 GIF로 출력시 : setContentType("image/gif");

이미지 JPG, JPEG로 출력시 : setContentType("image/jpeg");

 

 

출처 : http://blog.naver.com/PostList.nhn?from=postList&blogId=min_sub&categoryNo=20&currentPage=8

 

response.setContentType("text/html;charset=euc-kr");

PrintWriter out = response.getWriter();

....

 

respnse 변수에 대해 설명을 드리자면, Servlet의 doGet 혹은 doPost 함수의 파라미터로 response변수를 만들어 놓았을 것입니다.

response 변수에 실제 객체를 할당해주는 것은 servlet container가 알아서 해주기 때문에 개발자는 신경을 쓸 필요가 없습니다.

 

 보통 어떠한 Servlet으로 요청이 들어오게 되면, 그 요청을 파악을 해서 어떠한 응답을 클라이언트로 보내야하는지에 대한 분석이 이루어집니다.

 

흔히 클라이언트로부터 Servlet으로 요청이 들어오게 되면, 요청 파라미터라는 것이 같이 오게 되는데,

이것에 대한 분석은 request.getParameter("")이런한 식으로 파악을 하게 됩니다.

 

요청을 파악했으면, 클라이언트로 내보낼 응답을 작성해야 합니다.

대부분의 웹 프로그래밍은 응답을 텍스트로 작성하며, 이 텍스트는 대부분 HTML 페이지의 모양을 하고 있게 됩니다.

 

여기서 응답으로 텍스트를 기록해야하는데, 이때 스트림이라는 개념이 나옵니다.

그대로 데이터의 흐름이라고 보시면 됩니다.

 

Servlet에서는 클라이언트 쪽으로 보내는 데이터의 흐름을 건드려야 할 필요가 있습니다.

 

 위에서 언급했던 response 변수를 활용하면 응답과 관련된 많은 작업들을 수행 할수 있습니다.

응답 스트림에 텍스트를 기록하는 것도 가능하며, 이 작업을 하기 위해서 response.getWriter()를 호출해야 합니다.

 

보통 스트림에는 바이너리 기반의 스트림과 텍스트 기반의 스트림이 있습니다.

보통 바이너리 기반의 스트림은 InputStream(입력), OutputStrream(출력)이라는 것으로 끝나고,

텍스트 기반의 스트림은 reader(입력), Writer(출력)로 끝납니다.

 

언급했듯이 Servlet으로 들어온 요청은 대체로 텍스트(HTML)로 응답을 보내기 때문에,

 

PrintWriter out= response.getWriter(); 형식으로 응답으로 내보낼 출력 스트림을 얻어낸 후,

out.println("<script>"); 이런 식으로 스트림에 텍스트를 기록하게 됩니다.

 

출처 :

http://blog.naver.com/PostView.nhn?blogId=min_sub&logNo=80069919296&parentCategoryNo=20&viewDate=&currentPage=1&listtype=0

 

 

 

 

getParameter와 getAttribute의 차이점

Web/JSP 2012. 6. 12. 13:38 Posted by Request

getParameter와 getAttribute의 차이점이 궁금했다.

정확히 설명해주는 곳도 없어 네이버에게 물어보니

 

 

 

getParameter는 Servlet 또는 Jsp에서 파라미터로 넘어온 데이터를 가져다가 사용할때 사용한다.

 

그리고 getAttribute는 사용자가 임의적으로 추가해둔 데이터를 가져올 때 많이 사용된다.

 

set getAttribute는 Object 형식으로 넣을 수 있기 때문에 단순히 String형식이 아닌 기타 객체의 타입을 넣어서 역활을 합니다.

 

===================================================================================

딱히 어떨때 써야 할지 감이 오지 않는다.