제이쿼리(jquery) 기초 2

제이쿼리(jquery) 기초 2

1. core(기본사항), 주로 셀렉터
※ 셀렉터:

속성값 가져오기 or 태그와 태그사이값 가져오기

문서에 존재하는 두번째p 값 가져오기
$(function(){
 var jq=$(‘p’);
 alert($(jq[1]).text()); 
});

input박스 생성하기
$(function(){
 $(‘<input type=text id=”aaa” value=”text”>’).appendTo(‘body’);
});

맨 처음 태그 가져오기, 맨 마지막 태그 가져오기

$(function(){
 alert($(‘li:first’).text());
 alert($(‘li:last’).text());
});

맨 마지막 바로 전의 태그 가져오기
alert($(‘li:last’).prev().text());

전전의 태그 가져오기
alert($(‘li:last’).prev().prev().text());

맨 처음 바로 뒤의 태그 가져오기
alert($(‘li:first’).next().text());

클릭하면 특정 태그의 특정 속성(attr) 바꾸기
$(‘img’).click(function(){
 $(‘img’).attr(‘src’,’image/b.jpg’); 
});

2. 효과(effect)

보이게 하기 / 안 보이게 하기

$(‘img’).show(3000);
$(‘img’).hide(3000);

※ 괄호 안에 밀리초를 주면 됨

div의 css 바꾸기, 속성 바꾸기

$(‘div’).css({width:350,height:350,border:”1px solid black”}).attr(‘align’,’center’);