개발자의 끄적끄적

[javascript/jquery] javascript br to new line example / 자바스크립트 br 을 개행문자로 변경하는 방법 javascript 에서 html 문자열을 다루다 보면 br 태그를 개행문자로 변경해야 하는 경우가 종종 있습니다. 그럴때는 아래 함수를 사용하시면 됩니다. function brToNl(str) { return str.replace(//mg, "\n"); } 위 내용 보시면 아시겠지만, 문자열을 파라미터로 전달하면 br태그가 개행문자로 변경된 문자열을 반환받게 됩니다! 참고들 하세요!

[javascript/jquery] jquery toggleClass example / jquery 클래스 추가 제거 방법 jquery 에서 특정 요소에 class 를 동적으로 추가하거나 삭제해야 하는 경우가 있습니다. 그럴때는 대부분 addClass / removeClass 를 사용하는데요 아래 나온 내용과 같이 toggleClass 를 사용해도 변경이 가능합니다. $("#test").toggleClass("active"); 위 내용 보시면 아시겠지만, test 라는 아이디를 가지는 요소에 active 라는 클래스가 없으면 추가하고, active 라는 클래스가 있으면 제거합니다. 참고들 하세요!

[javascript/jquery] jquery filter example / jquery 필터 사용법 및 예제 jquery 에서 특정 요소들을 찾을때 find 와 filter 를 사용합니다. 이번에는 filter 사용법을 공유해보려고 합니다. .filter() 예를들어 test 라는 아이디를 가지는 div 를 모두 조회하려고 하는 경우에는 아래와 같이 filter 를 사용하시면 됩니다! $('div').filter('#test'); find 와 찾는 대상이 약간 다르니 꼭 참고하세요!

[javascript/jquery] 자바스크립트 함수 파라미터 기본값 설정 방법 javascript 에서 함수를 만들어서 사용하다보면 함수에 넘겨받는 파라미터가 없을 경우를 대비해서 기본값을 설정해야 합니다. 그럴때는 아래와 같이 기본값을 설정하시면 됩니다. function test(val) { val = typeof val !== 'undefined' ? val : ""; } 생각보다 유용하고 자주 쓰이니! 꼭 참고들 하세요!

[javascript/jquery] jquery children example / jquery 자식요소 찾는 방법 jquery 에서 특정 태그의 자식 요소를 찾아야 하는 경우에는 아래 나와있는 children 을 사용하시면 됩니다. children() 예를들어 div 라는 클래스명을 가진 태그의 자식 요소중 test 라는 클래스명을 가진 요소를 가져오려면 아래와 같이 children 을 사용하시면 됩니다! $(".div").children(".test"); 참고들 하세요!

[javascript/jquery] jquery draggable mobile example / jquery draggable 모바일 설정 방법 jquery 를 이용해서 특정 div 가 드래그 가능하도록 설정을 하려면 draggable 라이브러리를 사용합니다. 하지만 모바일에서는 정상적으로 동작하지 않는데요, 그럴때는 jquery.ui.touch-punch.min.js 라는것을 추가로 로드시켜주어야 합니다. jquery ui 로드가 끝난 다음에 바로 아래 스크립트를 로드시켜주시면 정상적으로 동작하실 겁니다! 참고들 하세요!

[javascript/jquery] jquery draggable 라이브러리 [링크] 홈페이지를 개발하다보면 유용한 jquery 라이브러리를 활용하게 되는데요! 그중에서 자주 쓰이는 라이브러리중 하나인 draggable 라이브러리가 있습니다. 특정 영역에 있는 div 같은 태그를 화면내에서 드래그 할수 있도록 도와주는 라이브러리인데요! 아래 링크 들어가셔서 샘플 테스트도 해보시고 적용방법도 한두번 보시면 금새 적용하실 겁니다! 참고들 하세요! jquery draggable library : https://jqueryui.com/draggable/ Draggable | jQuery UI Draggable Allow elements to be moved using the mouse. Enable dragga..

[javascript/jquery] javascript scrollIntoView example / 자바스크립트 스크롤을 특정 영역으로 이동 시키는 방법 javascript 에서 현재 페이지의 특정 영역으로 스크롤을 이동시켜야 한는 경우 여러가지 방법이 있을 수 있는데요, 그중에서 대부분 브라우저나 엘리먼트들에서 동작하는 방식을 공유하려고 합니다. 바로 아래와 같이 scrollIntoView 를 이용하는 방법입니다. 아래는 기본 사용법입니다. document.getElementById('ID').scrollIntoView(); 예를들어 아래와 같이 test_div 라는 아이디를 가지는 div 태그가 있다고 가정하고, 현재 페이지의 스크롤을 위 태그로 이동 시키고 싶으면 아래와 같이 scrollIntoVi..