특수문자

코드

특수문자

코드

특수문자

코드

<

&lt;

&#131;

>

&gt;

&

&amp;

&#134;

"

&quot;

공백

&nbsp;

&#159;

&trade;

!

&#033;

¡

&#161;

§

&sect;

"

&#039;

&#162;

æ

&aelig;

*

&#042;

¤

&#164;

¿

&#191;

=

&#061;

&yen;

×

&times;


jQuery 속성선택자


요소[속성]

특정 속성을 가지고 있는 문서 객체를 선택함

요소[속성=값]

속성 안의 값이 특정 값과 같은 문서 객체를 선택함
요소[속성~=값]속성 안의 값이 특정 값을 단어로써 포함하는 문서 객체를 선택함

요소[속성^=값]

속성 안의 값이 특정 값으로 시작하는 문서 객체를 선택함
요소[속성$=값]속성 안의 값이 특정 값으로 끝나는 문서 객체를 선택함

요소[속성*=값]

속성 안의 값이 특정 값을 포함하는 문서 객체를 선택함


사용 예)


$('input[type=text]').val("텍스트 값추가");




1. jQuery 기본 필터 선택자


요소:odd

홀수 번째에 위치한 문서 객체르 선택함

요소:even

짝수 번째에 위치한 문서 객체를 선택함
요소:first첫 번째 위치한 문서 객체를 선택함
요소:last마지막에 위치한 문서 객체를 선택함


사용 예)


과일명 당도
사과2
딸기3
수박4
멜론2


$('tr:odd').css('background', '#F9F9F9');

$('tr:event').css('background', '#9F9F9F');

$('tr:first').css('background', '#333333').css('color','#FFFFFF'); // 배경색 / 글자색



2. jQuery 입력 양식 필터 선택자


요소:button

input 태그중 type 속성이 button인 문서 객체와 button 태그를 선택함

요소:checkbox

input 태그중 type 속성이 check인 문서 객체를 선택

요소:file

input 태그중 type 속성이 file인 문서 객체를 선택

요소:imageinput 태그중 type 속성이 image인 문서 객체를 선택
요소:passwordinput 태그중 type 속성이 password인 문서 객체를 선택
요소:radio

input 태그중 type 속성이 radio인 문서 객체를 선택

요소:resetinput 태그중 type 속성이 reset인 문서 객체를 선택
요소:submitinput 태그중 type 속성이 submit인 문서 객체를 선택

요소:text

input 태그중 type 속성이 text인 문서 객체를 선택

요소:checked

체크된 입력 양식을 선택함

요소:disabled비활성화된 입력 양식을 선택함
요소:enabled활성화된 입력 양식을 선택함

요소:focus

초점이 맞춰져 있는 입력 양식을 선택함

요소:input

모든 입력 양식을 선택함(input , textarea , select , button 태그)

요소:selected

option 객체 중 선택된 태그를 선택함


사용 예) $("부모태그">"자식태그")


$('select > option:selected').val(); // select 로 선택된 값이 찾기



3. jQuery 함수 필터 선택자

요소:contains(문자열)

특정 문자열을 포함하는 문서 객체를 선택함

요소:eq(n)

n번째에 위치하는 문서 객체를 선택함
요소:gt(n)

n번째 초과에 위치하는 문서 객체를 선택함

요소:has(h1)

h1 태그를 가지고 있는 문서 객체를 선택

요소:lt(n)

n번째 미만에 위치하는 문서 객체를 선택

요소:not(선택자)

선택자와 일찌하지 않는 문서 객체를 선택함

요소:nth-child(3n+1)

3n+1번째에 위치하는 문서 책체를 선택함


사용 예)


과일명 당도
사과2
딸기3
수박4
멜론2


$('tr:eq(0)').css('background', '#000000').css('color', 'White');

$('td:nth-child(3n)').css('background', '#454545');

$('td:nth-child(3n+1)').css('background', '#333333').css('color','#FFFFFF'); // 배경색 / 글자색




jQuery 배열


$.each(array ,

function(index,item){ }) ;

(배열 , 함수(배열인덱스, 배열 인덱스 값))

// 함수를 배열겟수만큼 반복실행

$(selector).each(array ,

function(index,item){ }) ;

선택한 속성.each(배열 , 함수(배열인덱스, 배열 인덱스 값))

// 함수를 배열겟수만큼 반복실행




jQuery 메서드 (문서 객체 다루기)


addClass()

문서 객체의 클래스 속성을 추가 함. => $('선택').addClass('정의한 클래스이름');

removeClass()

문서 객체의 클래스 속성을 제거 함. => $('선택').removeClass ('삭제할 클래스이름');

arrt()

속성과 관련되 모든 기능을 수행함.

1. 이미지태그의 경로 속성값 알아내기

=> $('img').attr('src');

2. 속성 값추가

=> $(selector).attr(속성이름 , 속성값);

=> $(selector).attr(속성이름 , function( 속성각각의 index값 ,attr ){} );

=> $(selector).attr(object);

=> $('').attr('src', 'image.jpg').appendTo('body'); // body 에 img태스생성

=> $('' , {src:''image.jpg, width:350, height:250}).appendTo('body');

removeAttr(name)

문서 객체의 속성을 제거 함.
=> $('h1').removeAttr('data-index') // h1태그의 data-index 속성제거

css()

스타일과 관련된 모든 기능 수행

1. 스타일 속성값 가져오기

=> $('h1').css('color') // h1 태그의 색상값

2. 속성 값 추가

=> $(selector).css(name , value);

=> $(selector).css(name , function(속성 각각의 index값 ,style){} );

=> $(selector).css(object);

html()

문서 객체 내부의 글자와 관련된 모든 기능을 수행함 (html 태그인식)

1. 값 가져오기

=> $('h1').html(); // 맨처음 h1 태그 값만 출력

2. 값 추가

=> $(selector).html(value);

=> $('div').html('

내용

'); // 태그인식

text()

문서 객체 내부의 글자와 관련된 모든 기능을 수행함

1. 값 가져오기 
=> $('h1').text(); // 모든 h1태그 값을 출력

2. 값 추가

=> $(selector). text (value);

=> $('div'). text ('

내용

'); // 정규표현식 으로 표현

remove()

특정 문서 객체를 제거.

=> $('h1').first().remove(); // 첫번쩨 h1 삭제

empty()

특정 문서 객체의 후손을 모두 제거 함.

=> $('div').empty(); // div 자식 객체까지 삭제

$()

문서 객체를 생성함

=> $('

');

=> $('

').html('내용');

=> $('

').html('내용').addendTo('body'); // 태그와 내용을 body 에추가

$(a).appendTo(b)

a를 b의 뒷 부분에 추가함. (태그안)

=> $('img').first().appendTo('body'); // 첫번째이미지를 body 안 맨뒤로 보냄

$(a).prependTo(b)

a를 b의 앞 부분에 추가함. (태그안)

$(a).insertAfter(b)

a를 b의 뒷에 추가함. (태그 밖)

$(a).insertBefore(b)a를 b의 앞에 추가함. (태그 밖)
$(a).append(b)

b를 a안의 뒷 부분에 추가함.

$(a).prepend (b)

b를 a안의 앞 부분에 추가함.

$(a).after(b)

b를 a의 뒷에 추가함.
$(a).before(b)

b를 a의 앞에 추가함.

clone()

문서 객체를 복사

$('div').append( $(h1) ).clone()); // h1 태그를 div 태그안으로 복재




jQuery 이벤트


이벤트 객체속성

event.pageX

브라우저의 화면을 기준으로 한 마우스의 X좌표 위치

event.pageY

브라우저의 화면을 기중으로 한 마우스의 Y좌표 위치

event.preventDefault()

기본 이벤트를 제거함

event.stopPropagation()

이벤트 전달을 제거함


이벤트 메소드

$(document).ready()

html 문서가 다불러와지면 실행

bind()

이벤트를 연결함
=> $(selector).bind(eventName, function(event){} );

=> $(selector).bind(object);

unbind()

bind() 메서드를 사용한 이벤트 연결 제거

=> $(selector).unbind();

=> $(selector).unbind(eventName);

=> $(selector).unbind(eventName, function);

delegate()

현재 또는 미래에 존재하는 문서 객체에 이벤트를 연경함 (version:1.4.3*)

undelegate()

delegate() 메서드를 사용해 연결한 이벤트를 제거함 (version:1.4.3*)
live()

현재 또는 미래에 존재하는 문서 객체에 이벤트를 연결함

die()

live() 메서드를 사용해 연결한 이벤트를 제거함
=> $(selector).die()
=> $(selector).die(eventName)

=> $(selector).die(eventName , function)

one()

이벤트를 한번만 연결함

on()

이벤트를 연결함, 아래 이벤트열결을 대체함 delegate 대체함 version:1.7 )

=> bind() : $(selector).on(eventName , eventHandler)

=> live() : $(document).on(eventName , selector, eventHandler)

=> delegate() : $(selector).on(eventName , selector , eventHandler)

off()

이벤트를 제거함
=> unbind() : $(selector).off(eventName[, eventHandler])

=> die() : $(document).off(eventName , selector[, eventHandler])

=> undelegate() : $(selector).off(eventName , selector[, eventHandler])

toggle(function(event){},

... , function(event){} )

click 이벤트를 여러 이벤트 핸들러를 번갈아가며 실행할 수있게 연결함

hover(mouseenter , mouseleave)

mouseenter 이벤트와 mouseleave 이벤트를 동시에 연결함

trigger()

이벤트를 강제 발생 
=> $(selector).trigger(eventName)

=> $(selector).trigger(eventName, data)


마우스 이벤트

click

마우스를 클릭할 때 발생함.

dblclick마우스를 더블클릭할 때 발생함.
mousedown마우스 버튼을 누를 때 발생함.
mouseup마우스 버튼을 뗄 때 발생함.
mouseenter

마우스 요소의 경계 외부에서 내부로 이동할 때 발생. (자기자신만 이벤트)

mouseleave마우스 요소의 경계 내부에서 외부로 이동할 때 발생. (자기자신만 이벤트)

mousemove

마우스를 움직일 때 발생함.

mouseout마우스가 요소를 벗어날 때 발생함. (버블링)

mouseover

마우스를 요소 안에 들어올 때 발생함.(버블링)


키보드 이벤트

keydown키보드가 눌러질 때 발생함.
keypress글자가 입력될 때 발생함.

keyup

키보드가 떼어질 때 발생함.


윈도우 이벤트

ready

문서 객체가 준비를 완료함.
load

윈도우(문서 객체)를 불러들일 때 발생함.

unload

윈도우(문서 객체)를 닫을 때 발생함.

resize윈도우의 크기를 변화시킬 때 발생함.
scroll

윈도우를 스크롤할 때 발생함.
=> $(window).scroll(function(){ });

error

에러가 있을 때 발생함.


입력 양식 이벤트

change

입력 양식의 내용을 변경할 때 발생함.

focus

입력 양식에 초점을 맞추면 발생함.
focunsin입력 양식에 초점이 맞춰지기 바로 전에 발생함.
focusout입력 양식에 초점이 사라지기 바로 전에 발생함.
blur입력 양식에 초점이 사라지면 발생함.
select

입력 양식을 선택할 때 발생함(input[type=text] 태그와 textarea 태그 제외).

submitsubmit 버튼을 누르면 발생함.
reset

reset 버튼을 누르면 발생함.



간단한 이벤트 종류


blurfocusfocusinfocusoutload
resizescrollunloadclickdblclick
mousedownmouseupmousemovemouseovermouseout
mouseentermouseleavechange

select

submit
keydownkeypresskeyuperrorready



$(select).methodName(function(event){ });




jQuery effects


메서드

show()

문서 객체를 크게 하며 보여줌.

hide()문서 객체를 작게 하며 사라지게 함.
toggle()show() 메서드와 hide() 메서드를 번갈아 실행함.

slideDown()

문서 객체를 슬라이드 효과와 함께 보여줌.

slideUp()

문서 객체를 슬라이드 효과와 함께 사라지게 함.

slideToggle()

slideDown() 메서드와 slideUp() 메서드를 번갈아 실행함.

fadeln()

문서 객체를 선명하게 하며 보여줌.
fadeout()문서 객체를 흐리게 하며 사라지게 함.
fadeToggle()

fadeln() 메서드와 fadeOut() 메서드를 번갈아 실행함.

animate()

사용자 지정 효과를 생성함.

( opacity , height , width , top , bottom , left , right , margin , padding )
=> $(selector).animate(object);

=> $(selector).animate(object , speed);

=> $(selector).animate(object , speed , easing);

=> $(selector).animate(object , speed , easing , callback);

clearQueue()

큐의 내용을 제거 함.

stop()

효과와 애니메이션을 정지함.

=> $(selector).stop()

=> $(selector).stop(clearQueue)

=> $(selector).stop(clearQueue , goToEnd)

delay()

큐에 있는 명령을 잠시 중지함.

=> $(this).delay(500).animate({ left:500 }, 'slow' )


1. $(selector).method();

2. $(selector).method(speed); // 밀리초 단위의 숫자나 문자열 ( slow, normal , fast )

3. $(selector).method(speed , callback); // callback 효과를 모두 완료한 후에 실행할 함수를 지정

4. $(selector).method(speed , easing , callback);// 기본(linear , swing ) , easing플러그인 설치.


출처 : http://turfrain.tistory.com/40       작성자 : turfrain


<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>

 jQueryRotate.2.2.js 

 jQueryRotateCompressed.2.2.js

 

http://code.google.com/p/jqueryrotate/wiki/Examples

-키 생성 

keytool -genkey -alias 키이름 -keyalg RSA -keystore

 

-키 삭제

keytool -delete -alias 키이름 -storetype JCEKS -keystore(또는 생성된 위치 .keystore파일삭제)

 

-키 리스트 확인

keytool -list -v -keystore -storepass 입력비밀번호 -storetype JCEKS

 

 

톰캣 설정 방법(6.0)

 

<Connector connectionTimeout="20000" port="80" protocol="HTTP/1.1" redirectPort="8443"/>

하단에

 

<Connector SSLEnabled="true" clientAuth="false"
   keystoreFile="키스토어생성위치(예:C:\Users\admin\.keystore)" keystorePass="비밀번호"
   maxThreads="200" port="8443" scheme="https"
   secure="true" sslProtocol="TLS"/>

추가

 스트럿츠와 스프링 프레임워크의 가장 큰 차이점은 스트럿츠는 웹에 특화된 프레임워크라는 것입니다.

스트럿츠 프레임워크의 전반적 흐름은  웹 브라우저 사용자가 요청을 하면 서블릿에서 해당 요청을 받으면  structs.xml 설정에 따라 알맞은 액션으로 연결시킵니다 이과정에서 인터셉터(보안, 파일업로드..., 등)  에서 요청을 처리한 후 액션에 넘겨지게 됩니다. 액션에서 비즈니스 로직을 수행한 후 수행한 결과를 request객체에 담고 리턴된 포워드로 jsp를 연결하게 됩니다.

이런 일련의 과정들은 HTTP 요청방식에 대한 전반적인 처리를 다룬 다는 것입니다. 즉 웹 환경에만 특화된 것입니다.

 

반면,  스프링 프레임워크는 웹어플리케이션 뿐만 아니라 자바 어플리케이션에도 특화된 프레임워크입니다. 기본적으로 컨테이너라는 것을 제공하는데 이 컨테이너는 빈의 생성과 소멸등 일련의 라이프 사이크을 관리하게 됩니다. 환경설정도 스트럿츠 방식처럼  xml로 설정하는 방식뿐만이 아닌 자바 기반의 어노테이션을 활용하여 자바 빈들을 등록하실 수 있습니다.

이렇게 등록된 자바 빈은 웹 시스템 뿐만 아닌 어플리케이션에서도 활용 할 수 있습니다.

 

스프링은 MVC환경에 특화된 서블릿이나 컨트롤러 , 뷰리졸버 등을 제공하는 데, 사실상 이러한 것은 웹 환경을 지원하기 위해 제공하는 것입니다. 실질적으로 비즈니스 로직을 실행하는 Service나 Repository같이 자바빈으로 등록된 것 들은 웹 환경이 아닌 어디에서도 사용 가능합니다. 즉, 외부인터페이스에 확장까지 고려한 프레임워크라고 보시면 될 것 같습니다.

$(#id).animate({top:20}, 1000, null, baloonDown);

 

 

$(엘리먼트).animate({property},duration,easing,callback);


property : 에니메이션의 마지막에 도달해야 하는 값을 명시
               css에서 지원하는 값을 허용한다.

duration: 1/1000초 단위로 기술 또는 slow,fast등으로 기술

easing : 선택사항을 미묘하게 바꾸는 함수이름
            플러그인 형태로 제공된다.
            기본으로는 linear / swing 두 함수를 제공

callback : 에니메이션이 완료된 뒤 호출되는 함수이름

[출처] jQuery 에니메이션|작성자 냥꼬


[spring-application.xml]

...
<bean id="messageSource" class="org.springframework.context.support.ResourceBundleMessageSource">
<property name="basenames" value="cms/messages" /> <!-- messages.properties source 경로 --> <!-- 여러개일경우 property태그 안에<list><value>cms/messages</value></list>로 변경 -->
</bean>
<bean id="messageSourceAccessor" class="org.springframework.context.support.MessageSourceAccessor">
<constructor-arg ref="messageSource"/>
</bean>
<bean id="message" class="cms.util.CmsMessage">
<property name="messageSourceAccessor" ref="messageSourceAccessor"/>
</bean>
...




[CmsMessage.java]


package cms.util;

import java.util.Locale;

import org.springframework.context.support.MessageSourceAccessor;

/**
* Message
* @author J.H.Kim
*/

public class CmsMessage {

/**
* MessageSourceAccessor
*/

private static MessageSourceAccessor msAcc = null;

public void setMessageSourceAccessor(MessageSourceAccessor msAcc) {
CmsMessage.msAcc = msAcc;
}

/**
* KEY에 해당하는 메세지 반환
* @param key
* @return
*/
public static String getMessage(String key) {
return msAcc.getMessage(key, Locale.getDefault());
}

/**
* KEY에 해당하는 메세지 반환
* @param key
* @param objs
* @return
*/
public static String getMessage(String key, Object[] objs) {
return msAcc.getMessage(key, objs, Locale.getDefault());
}
}



[message.properties]

test={0}입니다.
test1=테스트~



사용

CmsMessage.getMessage("test", new String[]{"메시지 테스트"});
CmsMessage.getMessage("test1");

결과
메시지 테스트입니다.
테스트~


TAG사용

<%@ taglib uri="http://www.springframework.org/tags" prefix="spring" %>
...
<spring:message code='test' arguments='메시지테스트' var="testMessage"/>
<spring:message code='test1' var="testMessage1"/>
...
${testMessage}
${testMessage1}
...

결과
메시지 테스트입니다.
테스트~

 

 

[출처] Spring Properties Message 사용하기|작성자 듀스포에

INPUT[type=text]{
  font-size: 8pt;
  font-family:"돋움";
  border:0px; 
  text-align:center;

}  //ie

 

 

INPUT{
  border: expression( (this.type=='text')?'0px':'' );
  text-align:center;
  font-size: 8pt;
  font-family:"돋움";
}  //기타

select count(decode(to_char(hiredate,'mm'), '01', 1)) "1월",
       count(decode(to_char(hiredate,'mm'), '02', 1)) "2월",
       count(decode(to_char(hiredate,'mm'), '03', 1)) "3월",
       count(decode(to_char(hiredate,'mm'), '04', 1)) "4월",
       count(decode(to_char(hiredate,'mm'), '05', 1)) "5월",
       count(decode(to_char(hiredate,'mm'), '06', 1)) "6월",
       count(decode(to_char(hiredate,'mm'), '07', 1)) "7월",
       count(decode(to_char(hiredate,'mm'), '08', 1)) "8월",
       count(decode(to_char(hiredate,'mm'), '09', 1)) "9월",
       count(decode(to_char(hiredate,'mm'), '10', 1)) "10월",
       count(decode(to_char(hiredate,'mm'), '11', 1)) "11월",
       count(decode(to_char(hiredate,'mm'), '12', 1)) "12월",
       count(*) "전체"
from emp
where to_char(hiredate,'mm') >= '01' and
      to_char(hiredate,'mm') <= '12';


DECODE 함수 사용 방법

decode(검색컬럼, 조건1, 결과값1,..., 기본값)

[출처] 오라클 Decode 예제|작성자 흑향

+ Recent posts