[JQuery] 객체의 Class를 변경해보자

#제이쿼리 #자바스크립트 #CSS변경 #클래스변경 #removeClass #addClass 안녕하세요, 배곧동개발자 입니다. 간단하지만 많이쓰이는! 제이쿼리를 통한 클래스 변경을 알아볼까해요. 웹페이지에서 형태, 틀을 지정해줄때 쓰는게 클래스라는건데 쉽게말하면 옷이라고 보면 되요. 이거를 변경해줌으로써 권한에 따라 버튼이 보이고 안보이고, 색이 바뀌고 안바뀌고, 광고 변경, 모바일버전으로 변경등이 간단히 이루어져요. 일단 클래스를 만들어줍니다. bgDev1 이라는 클래스는 크키가 100px씩인 정사각형의 빨간색 네모이며 마우스는 손모양이네요. … Read more

[JQuery] 객체에 슬라이드 효과 입히기

#제이쿼리 #쉽지만이쁜효과 #slide #제이쿼리 #메뉴효과 #up #down #toggle #토글 #입력값 안녕하세요, 배곧동개발자 입니다. 제이쿼리가 좋은 이유는 여러가지가 있겠지만 여러 효과를 쉽게 컨트롤 할 수 있다는 점이 있어요. 그 중 하나로 slide를 알아볼까 합니다. 1. slide event 슬라이드, 미끄러진단 느낌이죠? 스윽하고 내려오고 스윽하고 올라가는! 그러한 모션을 아주 쉽게 할수있어요. 자바스크립트로만 구현 하려면 어우.. 저는 구현 안할랍니다. … Read more

[JavaScript] 변수 형 확인 및 변환

#자바스크립트 #형변환 #typeof #parseFloat #parseInt 안녕하세요. 배곧동개발자 입니다. 자바스크립트에서 우리가 가장 많이 쓰는 변수는 무엇이죠? 네, 너무 당연하게 var 입니다. 모든게 통용되지요. 1. 문제점 하지만, var변수에 숫자를 넣고 비교를 하게 되었을 때에 원하는 결과값을 얻지 못하는 경우가 있으셨을겁니다. 난 숫자 비교를 하고 싶었지만 프로그램은 문자 비교를 했기 때문입니다. 이런 케이스를 막기 위해서 자바스크립트에서도 var가 아닌 … Read more

[JSTL] 콤마를 찍어보자!

#JSP #콤마표현 #포멧 #금액 #자바스크립트도있지만 #JSTL도한번써봐 #컴마 #comma 안녕하세요, 배곧동개발자 입니다. 웹페이지에서 금액을 뿌려줄 때, 컴마를 넣기 매우 귀찮으시죠? 자바스크립트로 포멧을 만들던가 자바에서 만들어서 뿌려줄수도 있는데, JSTL에서도 가능한거 알고 계셧나요? 심지어 아주 쉽게 가능합니다. 1. 라이브러리 추가 JSP페이지 상단에 JSTL FMT 라이브러리를 추가해주세요. 혹 기존에 fmt: 라고 써서 JSTL의 function들을 사용하고 계셨다면 안넣어주셔도 됩니다. 어딘가 … Read more

[JavaScript] 콤마 생성 및 삭제하기!

#자바스크립트 #변수값콤마생성 #변수값콤마삭제 #콤마제거 #컴마제거 #comma생성 #콤마만들기 #자바스크립트콤마 #JS콤마 안녕하세요, 배곧동개발자 입니다. 입력폼을 만들다보면 가격과 같은 부분을 만들때 천단위로 짤라서 콤마를 입력해야하는 경우가 생깁니다 그럴때 사용하시면되는 소스코드를 알려드릴께요! 1. 콤마 추가 이렇게 선언을 해 준다음에 실행을 한번 해봅시다. 콤마가 아주 이쁘게 붙었지요? 그럼 이제 제거를 해봅시다. 2. 콤마 제거 정규식을 이용해서 ,를 삭제해주는 겁니다. 역시나 … Read more

[JavaScript] PC, 모바일 접속 확인하기

#접속기기확인 #접근확인 #모바일체크로직 #모바일확인 #소스코드 #설명은생략한다 #레퍼런스 #자바스크립트 안녕하세요, 배곧동개발자 입니다. 모바일의 사용량이 증가함에 따라 웹페이지들의 모바일접근성을 구하는 경우가 많죠? (사실상 이제는 필수) 또는 아직 간혹 사용중인 엑티브엑스등의 사용에 의해 모바일에서의 접근을 막아야 하는 경우도 있구요. 그러한 경우에 PC로 접근했는지 모바일로 접근했는지를 알아야하는데… 어떻게 알 수 있을까요? 1. 로직 만들기 위의 소스를 쓰시면 아주 간단히 … Read more

[JavaScript] 특정단어 하이라이트 주기

#자바스크립트 #제이쿼리 #JQuery #통합검색 #검색어표시 #단어표시 #replaceAll #CDN #자바스크립트 안녕하세요, 배곧동개발자 입니다. 여러 사이트에서 검색을 했을 때에 하이라이트 표시되는거 한번씩은 보였죠? 이걸 자바스크립트로 구현을 한번 해보도록 하겠습니다- 먼저 이런 소스가 하나 있고 여기서 특정 단어 “배곧동”에 하이라이트를 주려고 한다고 가정해봅시다. $(“#notice”).html()을 보시면 html태그까지 모두 읽히는거 보이시나요? “배곧동”을 태그로 감싸주고 css를 입힌다. 라는게 이번 포스팅의 핵심인데요- … Read more