본문 바로가기

분류 전체보기

(148)
[JQuery] Jquery(제이쿼리) prepend(), append() - 해당 객체의 앞쪽에 추가할 수 있는 함수 - 해당 태그요소를 적용하여 사용가능 ------------------------------ body 시작 -------------------------- WebContent/jq1/test6.jsp ------------------------------ body 끝 ---------------------------- - 해당 객체의 뒤쪽에 추가할 수 있는 함수 - 해당 태그요소를 적용하여 사용가능 ------------------------------ body 시작 -------------------------- WebContent/jq1/test6.jsp ------------------------------..
[JQuery] Jquery(제이쿼리) 클래스명 부여하기 addClass() - 해당 객체에 클래스명을 부여하는 함수 - body 안에 있는 객체가 많을 때 일일이 클래스명을 부여하지 않아도 되는 방법이다. ① body 안에 있는 에 'high_인덱스번호' 라는 클래스명을 부여해서 뒷배경 색을 각각 부여 item-0 item-1 item-2 item-3 item-4 - addClass()함수를 $('h2')에 적용했을 때 위의 사진처럼 클래스명이 모두 적용되어 마지막 클래스명인 'high_4'로 인식이 된다. - 그래서 style 태그에서 'high_4'의 뒷배경 색인 아쿠아색이 모두 적용되는 것이다. - 각각 배경을 바꿔주려면 this를 사용해야한다. · this : 방문자가 페이지에 방문해서 이벤트를 발생시킬 때마다 해당요소를 가리키는 레퍼런스를 의..
[JQuery] Jquery(제이쿼리) setInterval() 일정주기 반복하기 - 동작을 일정 주기동안 반복하게 해줌 - 제이쿼리 문법이 아니라서 자바스크립트 문법 참고해야한다. https://www.w3schools.com/jsref/met_win_setinterval.asp Window setInterval() Method W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com - setInterval(동작, 반복 주기)..
[JQuery] Jquery(제이쿼리) html(), text() 속성의 값 가져오기 - html() : 해당하는 요소의 가장 처음 대상의 값만 가져옴 · 요소의 자식 태그들의 태그나 문자열을 모두 읽어옴 - text() : 해당하는 모든 요소의 값을 가져옴 · 단순 text로 읽어옴 ① 속성의 값 출력하기 $(function(){ var ht = $('h2').html(); alert(ht+"@@@@"); var tx = $('h2').text(); alert(tx); }); head-0 head-1 head-2 · 의 맨 처음 값만 가져온다. · 의 값 전부를 가져온다. ② 속성의 값 변경하기 - 변경하고자 하는 텍스트를 ( )안에 넣어주면 된다. $('h2').text("hello"); head-0 head-1 head-2 - 속성 값에 연결연산자(+)를 ..
[JQuery] Jquery(제이쿼리) attr() 함수 - 특정 대상의 속성 정보를 처리하는 함수 - 대상.attr(); ① 이미지의 src 정보를 가져옴 ② 이미지의 테두리 두께를 5로 지정 ③ 이미지 3개의 테두리를 각각 5, 10, 15로 지정 $('img').attr('border',function(index){ return (index+1)*5; }); ④ 모든 img 태그에 테두리 - 5, 너비 - 100, 높이 - 200 으로 설정 $('img').attr({ border : 5, width : 100, height : 200 }); ⑤ 모든 img 태그에 테두리 - 5, 너비 - 100, 높이 - (100,200,300) 으로 설정 $('img').attr({ border : 5, width : 100, height : fu..
[JQuery] Jquery(제이쿼리) 요소의 속성 값 사용 방법 - 요소의 속성값을 가져오기 방법은 아래 포스팅 참고 [JQuery] Jquery(제이쿼리) 속성탐색 선택자, 위치탐색 선택자 - [객체].동작(); - 객체에 들어갈 수 있는 것들 · * : 전체 요소를 뜻함 ·태그명 : 특정 태그 요소만 접근 · id값 : 객체에 부여한 id값을 '#'로 호출 · class값 : 객체에 부여.. heezit.tistory.com var c = $('h2').css('color'); - 'h2' 태그의 글자색 정보를 가져와 변수 c에 저장함 ① 속성의 값을 여러개로 변경 - 배열을 사용함 $(document).ready(function(){ var col = ['red','green','blue',..
[JQuery] Jquery(제이쿼리) 속성탐색 선택자, 위치탐색 선택자 - [객체].동작(); - 객체에 들어갈 수 있는 것들 · * : 전체 요소를 뜻함 ·태그명 : 특정 태그 요소만 접근 · id값 : 객체에 부여한 id값을 '#'로 호출 · class값 : 객체에 부여한 class값을 '.'로 호출 $(document).ready(function(){ $('*').css('color','red'); $('h2').css('color','pink'); $('input').css('color','orange'); $('#title1').css('color','green'); $('.title2').css('color','blue'); }); 제목1 제목2 아이디 : 비밀번호 : - h2에 pink색이 깔려있고 그 위에 id값과 class값에 ..
[JQuery] Jquery(제이쿼리) 설치 및 사용 - 자바스크립트의 라이브러리 - HTML 문서를 좀더 다양하게 사용할 수 있도록 해줌 ① 제이쿼리 설치(다운로드)하기 https://jquery.com/download/ Download jQuery | jQuery link Downloading jQuery Compressed and uncompressed copies of jQuery files are available. The uncompressed file is best used during development or debugging; the compressed file saves bandwidth and improves performance in production. You can also download jquery.com ..