티스토리 뷰

VIEW/JSP&SERVLET

[JSP] jquery

찰떡쿠키부스트 2017. 12. 1. 15:35

 

 

jquery 정리

 

jQuery(제이쿼리)는 브라우저 호환성이 있는 HTML 속 자바스크립트 라이브러리

 

:웹브라우저 마다 각자 자신의 형식이있어서 자바스크립트로 짠거를 크롬은돼는데

인터넷익스플로어는 안될수도있다.

그래서 다 통합시켜주는 자바스크립트 라이브러르중 하나의방식이다.



jquery 객체
$(선택자) --> "element" ".class" "#ID" 등등 선택자 엄청 많음
$(선택자,document.forms[n]) 폼태그 검색해서 사용


$(document).ready(function(){});
    = $(function(){ });
-->자바스크립트의 window.onload=function(){}과 같은역할
 
 jquery 메서드
 -메서드체이닝 가능(체인처럼 연결가능(리턴형이 같을때 ))
 1)css()
 .css("name","value") -->setting 효과
 ex) .css("background","pink");
 .css(properties)     -->map
 ex) .css({"background":"pink","border":"2px solid"});
 .css("name")         -->getting 효과
 ex) .css("background");
 
 2)text() :text만 받아옴
   text()   --> getting 효과 return형:string
   text("") --> setting 효과 return형:jquery
  
 3)html() : tag도 받아옴(html 형식 받아옴)

 4)val() :form태그에서 value값 얻을때 사용
   val()     --> getting 효과
   val("")   --> setting 효과

 5)click() : 이벤트호출
   $(버튼주소).click(function(){});

 6)each(callback 함수(index,element){}) : for문이랑 비슷함
   ex)
   $(document).ready(function(){
 var ar=["red","orange","yellow"];
 $("h1").each(function(index,obj){
 $(obj).css("color",ar[index]);
 });
 });

  6-2) $.each
  $.each(객체,function(key,val){});
  $.each(배열,function(index,val){});


   ex)
  -객체-
   <script>
   var a={"aa":"bb","cc":"dd","ee":"ff"};
   $.each(a,function(key,value){
   alert(key+","+value);
   });

   -배열-
  var b=[100,200,300];
  $.each(b,function(index,value){
  alert(index+","+value);
  });
  </script>

  7)A.append(B);  :B가 A안에 자식태그로 들어간다.
    B.appendTo(A) :B가 A안에 자식태그로 들어간다.

  8)$.trim(); :공백빼라.
  9) .eq(position); -->position에있는거 뽑아내라

 
  
 
 # jquery 엘리먼트,어트리뷰트 생성

$("<ol/>", {"id" : "olTag"}).appendTo("#listTable");

-- 이런식으로 직접 엘리먼트를만들고 어트리뷰트를 생성 할 수 있다.

'VIEW > JSP&SERVLET' 카테고리의 다른 글

[JSP] json,$.ajax()  (0) 2017.12.01
[JSP] jQuery Selectors  (0) 2017.12.01
[JSP] application,session,화면이동,영역정리  (0) 2017.12.01
[JSP] db연동,관련문제  (0) 2017.12.01
[JSP] request객체  (0) 2017.12.01
댓글