# history.back() if(historyBack){ // history.go(-3); => 뒤로가기 3회라는 의미 // history.go(-1); == history.back(); history.back(); } # location.replace() var replaceUrl = ''.trim(); if(replaceUrl != '' && replaceUrl != 'null'){ // historyBack으로 뒤로 돌아갈 경로를 설정하는 것 // location.replace()를 하지 않으면 그냥 뒤로가기가 되어 흔적이 남게 됨 // location.replace()는 흔적이 남지 않고 설정된 replaceUrl로 historyBack 시행 location.replace(replaceUrl)..

# jQuery jQuery란 JavaScript의 생산성을 향상시켜주는 JavaScript 라이브러리이다. 더보기 라이브러리란? 자주 사용하는 코드들을 재사용할 수 있는 형태로 가공해서 프로그래밍 효율을 높여주는 코드들이다. jQuery를 사용하면 아주 편하게 HTMl 요소를 선택하고, 쉽게 특정 동작들을 설정할 수 있다. 사용 예시 : $(선택자).동작함수(); //달러($) 기호는 제이쿼리를 의미하면서 제이쿼리에 접근할 수 있는 식별자 //괄호안에 "선택자"를 이용하여 원하는 HTML 요소를 선택하고 동작 함수를 정의하여 //선택된 요소에 원하는 동작을 설정 # jQuery의 특징 Element를 선택하기 쉽게 할 수 있다. 선택된 Element들을 효율적으로 제어할 수 있다. # javaScrti..

# text() $('.loginIdInputMsg').text('텍스트 입력됨'); //텍스트 입력됨 # empty() $('.loginIdInputMsg').empty(); //내용을 지움(비움) # append() $('.loginIdInputMsg').append('텍스트'); //text에 이어 붙임 # html() $('.loginIdInputMsg').html('기존 내용을 지우고 덮어씀'); //기존 내용을 지우고 덮어씀

# bootstrap css라이브러리 장점-웹사이트 개발시 필요한 기본적인 요소 디자인들이 구비되어 있음 단점-수정이 까다로움, 다른 라이브러리와 호환이 어려움 # tailwind 각종 유틸들을 모아놓음 각 요소를 통으로 만들어 놓은것이 아닌 요소를 만드는데 필요한 유틸들을 조합하는 방식 tailwind cheat sheet에서 원하는 요소를 검색해서 찾아볼 수 있음

결론부터 말씀드리자면, 불가능합니다. jsp와 javascript가 전혀 다른 레벨의 언어이기 때문이죠. jsp는, 쉽게 말해서 그냥 HTML을 만들어주는 언어일 뿐이죠? 하지만 javascript는 HTML 위에서 작동하는 언어입니다. (jsp가 아니라 그냥 HTML이었다고 한번 생각해보세요) 즉, 프로그램 로직 -> JSP -> HTML -> javascript 의 순서로 실행되기 때문에, JSP 변수값을 javascript에서 받을 수는 있어도, javascript 변수값을 JSP에서 받을 수는 없습니다. javascript 변수값을 JSP에서 사용하시려면 반드시 FORM을 사용해서 페이지를 전환시켜주어야 합니다. 새로 뜨는 페이지에서 parameter를 받아서 javascript 변수값을 알아내는..

해당 element 위에서 터치를 하거나(touchmove) 마우스 휠을 통해 스크롤을 하려는 경우(mousewheel) 이를 차단해서 스크롤을 방지해주는 쿼리 $('#element').on('scroll touchmove mousewheel', function(event) { event.preventDefault(); event.stopPropagation(); return false; }); 해당 element에 적용되고 있던 스크롤 락을 해제하는 쿼리 $('#element').off('scroll touchmove mousewheel');

방법1. - 이 방법은 overflow:hidden;으로 틀을 벗어나는 텍스트는 안보이게 하고, text-overflow:ellipsis;로 넘친 부분들을 말줄임표시로 나타내도록 하는 방법이다. - white-space:nowrap; 넘치는 텍스트가 자동 줄바꿈이 되지 않도록 nowrap 속성을 부여해준다. #box { width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } 방법2. - 이 방법은 마찬가지로 overflow:hidden;으로 틀을 벗어나는 텍스트는 안보이게 하고, word-wrap:break-word;를 통해 단어를 기준으로 줄바꿈을 실시하는 속성을 부여해주는 방법이다. #box { width:100px; o..

$(function() { var scrollBottom = $(document).height() - $(window).height() - $(window).scrollTop(); // 보이기 | 숨기기 $(window).scroll(function() { if ($(this).scrollTop() < 200) { //200 넘으면 버튼이 보임 $('.top-button').fadeOut(), $('.bottom-button').fadeOut(); } else { $('.top-button').fadeIn(), $('.bottom-button').fadeIn(); } }); // 버튼 클릭시 0 까지 animation 이동 $(".top-button").click(function() { $('html, ..

// url의 파라미터를 찾는 함수 $.urlParam = function(name){ var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(URL); if (results==null){ return null; } else{ return results[1] || 0; } } //url에 포함된 파라미터 중 원하는 파라미터키?의 이름을 통해 원하는 파라미터 값을 찾을 수 있다. const visitArticleId = $.urlParam('id');

# setTimeout()? - 일정 시간 후에 특정 코드, 함수를 의도적으로 지연한 뒤 실행하고 싶을 때 사용하는 함수 # setTimeout() 사용법 setTimeout(지연시킬 함수명, 지연시간); # clearTimeout()? - setTimeout()를 중지, 삭제시키는 함수 # clearTimeout() 사용법 setTimeout(지연시킬 함수명, 지연시간); clearTimeout(함수명);