웹/JSP (26) 썸네일형 리스트형 [JSP] <JavaScript> DOM DOM이란 ◎ Document Object Model의 약자이다. ◎ 마크업 언어로 작성된 문서를 프로그래밍 언어가 이해하고 조작할 수 있는 객체 모델로 변환한다. ◎ JavaScript와 같은 스크립팅 언어를 사용하여 웹 페이지의 요소를 동적으로 조작하고 수정할 수 있다. 예제 코드 // JavaScript를 사용하여 DOM을 조작하는 부분 document.addEventListener('DOMContentLoaded', function() { // 색상 변경을 위한 함수 정의 function changeColor() { // 랜덤한 RGB 값 생성 var red = Math.floor(Math.random() * 256); var green = Math.floor(Math.random() * 256).. [JSP] <JSTL> 페이징 번호 출력 ◎ 총 페이지 수에 따라 페이지 링크를 생성 ◎ 각 페이지에 대한 URL을 포함하여 해당 페이지로 이동 View 코드 설명 ◎ JSTL의 태그를 사용하여 페이지를 반복하는 루프를 시작 ◎ begin 속성은 루프가 시작될 값 ◎ end 속성은 루프가 종료될 값 ◎ ${totalPages}는 총 페이지 수를 나타냄 ◎ JSTL의 태그를 사용하여 URL을 생성 ◎ var 속성은 생성된 URL을 저장할 변수의 이름을 지정 ◎ value 속성은 생성될 URL의 기본 부분을 지정합니다. ◎ 태그 내에서 사용 ◎ URL에 파라미터를 추가 ◎ name 속성은 파라미터의 이름을 지정 ◎ value 속성은 파라미터의 값 ◎ ${page}를 사용하여 루프 변수인 page의 값을 지정 ◎ 태그를 사용하여 페이지 링크를 생성 .. [JSP] <HTML> span태그 특징 HTML 문서에서 인라인 요소(inline-element)들을 하나로 묶을 때 사용한다. 주어진 데이터만큼만 공간을 차지한다. span태그를 연달아쓰면 한 라인에 이어져서 출력이 된다. 줄바꿈이 되지 않는다. 이용 내용 예시 span1 span2 span3 span1 span2 span3 [JSP] <JSTL> 비교 연산자 == eq != ne gt = ge [JSP] <JSTL> varStatus 사용 foreach문과 같이 사용된다. 종류 current 현재 for문의 해당하는 번호 index 0부터의 순서 count 1부터의 순서 first 첫 번째인지 여부 last 마지막인지 여부 begin for문의 시작 번호 end for문의 끝 번호 step for문의 증가값 [JSP] <JSTL> foreach로 생성된 테이블의 행에 index붙이기 varStatus를 이용한다. [JSP] <JavaScript> foreach로 생성된 테이블 데이터 가져오기 html 쿠폰이름 할인율 만료기간 카테고리 ${coupon.cpName} ${coupon.discount}% ${coupon.period} ${coupon.category} JavaScript var selectedCoupons = []; // 습득한 데이터들을 담을 변수 $("input[type=checkbox]:checked").each( // input태그의 타입이 checkbox인 것중 check된 것만 반복 // 반복문 안의 기능 function() { var couponName = $(this).closest("tr").find("td:eq(1)").text(); var discount = $(this).closest("tr").find("td:eq(2)").text(); var period .. [JSP] <JavaScript> 라디오 버튼을 선택한 상태에서 textarea 값을 습득이 불가 수정 전 코드 function writeReview(){ var form = document.getElementById('writeReviewForm'); var radioButtons = document.querySelectorAll('input[type=radio][name="rating"]'); radioButtons.forEach(function(radioButton) { console.log("[로그] 라디오 반복문"); if (radioButton.checked) { console.log("[로그] 별점 :" + radioButton.value); form.innerHTML += ''; } }); var a = $("#contents").val(); console.log("[로그] 내용 :" .. 이전 1 2 3 4 다음
