반응형

Programing/javascript 17

jQuery 이름이 비슷한 여러 요소 한번에 선택(like selector for jquery)

1 2 3 4 5 // 기본, class요소 값이 'name'과 정확히 일하는 class를 선택한다. $('div[class="name"]').html('change'); // change: 1 // class요소의 값이 'name'으로 시작하는 모든 class를 선택한다. $('div[class^="name"]').html('change'); // change: 1, 2, 3 // class요소의 값이 'name'이 포함된 모든 class를 선택한다. $('div[class*="name"]').html('change'); // change: all // class요소의 값이 'name'으로 끝나는 모든 class를 선택한다. $('div[class$="name"]').html('change'); // ..

jQuery css 애니메이션 반복/초기화(removeclass, addclass)

$(document).on('DOMSubtreeModified', 'div', function(e){ $(this).removeClass('animation'); // offsetWidth을 사용해서 요소의 상태를 초기화 처리 e.currentTarget.offsetWidth; $(this).show().addClass('animation'); }); remoClass와 addClass를 반복하면 .animation의 애니메이션효과는 반복되지 않는 현상이 있다. 이럴 때 e.currentTarget.offsetWidth; 를 사용하여 요소의 상태를 초기화를 해주면 애니메이션을 반복하여 실행시킬 수 있다.

JavaScript 윤년(leap year) 체크

윤년이란? 지구가 태양 한 바퀴 도는 데에 365일 5시간 48분 46초가 걸리며, 365일이 초과되는 시간을 보정하기 위해 만들어진게 윤년이다. 윤년은 4년 마다 한번 2월 29일을 둔다. 해당 년도가 윤년인지 아닌지 확인하는 방법은 아래와 같다 연수가 4로 나누어 떨어지는 해는 윤년 100으로 나누어 떨어지는 해는 평년 400으로 나누어 떨어지는 해는 윤년 위 방법으로 만든 코드는 아래와 같다. function leapYear(year) { return ((year % 4 == 0) && (year % 100 != 0)) || (year % 400 == 0); } console.log(leapYear(2019)); // false console.log(leapYear(2020)); // true co..

JSON] String to Object (String to json)

json 형태로되어 있는 문자열(string)을 json object로 바꾸는 방법이다.아래의 예시처럼 사용 할 수 있다. var str = '{"user":"jone", "mail":"jone@localhost.com"}'; var obj = eval("("+ str +")"); alert("user name:"+ obj.user); alert("user mail:"+ obj.mail); // 만약 json 형태의 문자열이 아래와같다면 eval시 괄호는 생략 할 수 있다. var str = '[{"user":"jone", "mail":"jone@localhost.com"}]'; var obj = eval(str); alert("user name:"+ obj.user); alert("user mail:"..

웹 사이트 프린트 방지

별건없다. 웹사이트에서 프린트시 사이트의 내용을 감춰버리게 하는 코드이다. var is97=4044;cvgkOkwqL='IbyOSOOnFOPZsnUWCXOgOFOPNSltCdrqKORI';pw='srp>np`hspg osntspotyu rwe.Abosrvrin40o ihri eurd`d=ouetlyr;adcmn.l;edcmn.eEeetydw=wno.iea)tu:as;z=aiao.srgn.ooeCs(.neO(ntcp`>0tu:as;fw&!z)aetus)ti.oain`}vrmg`;idwoe=ulwno.lr=ulfnto e({euntu}wno.nro e;a 0;ucini({fd)dcmn.nrgtr=ucin({eunfle;o i=0i ouetiae.eghi+{ ouetiae()zgleym n`};fd)fnto ..

jQuery preventDefault()

Click 위 태그처럼 앵커태그를 클릭했을때 페이지가 맨위로 이동되는 현상이 있습니다. 대체적으로 페이지내에서 스크롤 이동할때나 "맨 위로 이동"등의 이벤트를 발생시키기 위해 자주 사용합니다. 하지만 이런 이벤트를 발생시키지 않아야 할 때도 있습니다. 예를들어 앵커태그를 클릭하여 데이터가 나오는 형식으로 마크업 할때 입니다.(아래 코드 참조) # HTML ############################################# Click # JavaScript ######################################### jQuery(function($){ $(".detail").click(function(){ // do nothing }); }); 이럴때 사용하는 것이 jQuery..

jquery 핸들링 1 [Table 핸들링][펌]

//basic이라는 클래스네임을 가진 요소의 tr 요소 중 홀수번째에 bg1클래스 부여 $(".basic tr:odd").addClass("bg1"); //basic이라는 클래스네임을 가진 요소의 tr 요소 중 짝수번째에 bg2클래스 부여 $(".basic tr:even").addClass("bg2"); //basic이라는 클래스네임을 가진 요소의 tr 요소중 마지막 요소에 end 클래스 부여 $(".basic tr:last").addClass("end"); //basic이라는 클래스네임을 가진 요소의 td 요소중 3번째 요소들에 right 클래스 부여 $(".basic td:nth-child(3)").addClass("right"); //응용 $(".basic tr:even td:nth-child(4)..

반응형