LATEST POSTs 최근 등록된 포스팅 목록 최신순

---

인기순

• js 자바스크립트를 사용하여 앞글자만 대문자로 바꾸는 방법 자바스크립트를 사용하여 대문자 또는 소문자로 바꾸는 방법은 간단한 함수를 사용하여 가능하다. 하지만 만약 앞글자만 대문자로 바꾸려면?아래 방법은 전체가 아닌 원하는 텍스트의 앞글자만 대문자로 표기하는 방법이다.# 자바스크립트를 사용하여 앞글자만 바꾸는 방법일단 순수 자바스크립트를 사용하여 앞글자만 바꾸는

  View : 218 / 2017-01-30
• js angularjs one way, two way 바인딩 알아보기 AngularJS의 가장 큰 장점은 손쉽게 Two-way binding(양방향 바인딩)을 사용할 수 있다는 점이다. 데이터, 즉 모델값을 뷰에 바인딩하기 위하여 단방향, 양방향 바인딩을 사용하는데 이 둘의 차이점은 다음과 같다.# 단방향과 양방향 바인딩의 차이점i. 단방향 바인딩(one-way binding); 단방향 바인딩은 처음 모델이 가진 값을 뷰에 표현하고 나중에

  View : 2564 / 2017-01-25
  
• js 데이터베이스에 저장된 태그를 부등호가 보이도록 html 문서에 그대로 출력하는 방법 데이터베이스에 저장된 태그를 부등호가 보이도록 html 문서에 그대로 출력하는 방법에 대하여 알아보자! 사실 제목을 읽어보면 무슨 뜻인지 이해가 잘 되지 않을 수 있다... 쉽게 이해하기 위해서 아래와 같은 예를 들어보자. 만약 아래와 같은 일을 수행해야 한다면?"<span> 태그를 배워보자!" 이 텍스트를 서버에 저장하고 나중에 불러와 제목 영역에 문자 그대로 출력할 수 있게한다. 우리는 다음과 같은 과정을 생각해볼 수 있

  View : 3129 / 2017-01-18
• js [angularjs] isNumber 숫자 타입 확인하기 AngularJS는 데이터 타입이 무엇인지 확인하기 위한 방법으로 간단한 메소드를 사용할 수 있다. 그 중에서 숫자타입을 확인하기 위한 방법으로 isNumber() 메소드를 사용할 수 있다.간단한 사용방법은 아래와 같다.<div clas

  View : 2324 / 2017-01-03
• js ngRoute를 사용한 routeProvider 정보 및 예제 angularjs의 ngRoute를 사용하면 싱글페이지 앱(SPA) 어플리케이션의 페이지 이동을 구현하기 쉽도록 도와줍니다. 해당하는 앱에서 ngRouter 모듈을 추가한 뒤 config 객체에 $routeProvider를 설정합니다. 그럼 아래를 봐주세요.# $RouteProvider  예제보기이 예제는 간단한 링크를 생성하고 해당하는 링크를 클릭할 경우 정해진 template을 호출하는 간단한 예제입니다.<div class=

  View : 1955 / 2016-12-26
• js [자바스크립트] 객체 반복문 사용하여 배열로 만드는법 객체 타입의 데이터를 사용해 반복문을 만드는 경우... 그리고 특정한 값... 예를 들러 key 또는 value만 반환하여 사용해야하는 경우가 있다. 또한 객체를 사용해 배열을 만들 필요도 있을 것이다. 아래는 이를 수행하는 간략한 방법에 대하여 알아보겠다.대부분 라이브러리는 다양한 내장함수를 통해 이를 가능케하지만 지원하지 않거나 별도 모듈이 필요한 경우 사용하면 될 것이다. 그럼

  View : 12089 / 2016-12-22
• js ngSwitch 디렉티브를 사용하는 방법 상황에 따라 변하는 텍스트 및 요소들을 구현하기 위하여 ng-switch 디렉티브를 사용할 수 있습니다. ngSwitch는 자바스크립트 switch() 비슷한 역할을 구현가능하게 해줍니다.만약 사용자가 글을 작성하게 저장할 경우 Save 버튼이 Saved로 변경하게 만들 경우 이 역시 switch를 사용하는 방법이 가능합니다. (참고로 조건이 적은 경우 <span data-custom

  View : 2192 / 2016-12-19
• js ngRequired 입력폼 submit 버튼 비활성화 만들기 다수의 입력폼 양식을 만들고 몇 개의 요소들은 필수 나머지들은 옵션인 경우 submit 버튼은 활성 또는 비활성화일 필요가 있습니다. 이를 구현하기 위한 방법으로 ngRequired 디렉티브를 사용할 수 있습니다.<span data-custom

  View : 3177 / 2016-12-13
• js [angularjs] ngRepeat 디렉티브 배우기 angularjs에서 가장 많이 사용되는 디렉티브 중 하나가 바로 ng-repeat라고 할 수 있습니다. 워낙 많이 사용되기 때문에 반드시 알아야 하는 필수 디렉티브로 아래는 ng-repeat의 쓰임과 활용에 대하여 상세히 알아보려합니다.! ng-repeat의 역할ng-repeat는 연속된 여러개의 값을 가진 데이터 값을 사용하여 하나의 리스트 또는 목록으로 반환하고 보여주는 기능을

  View : 2456 / 2016-12-12
• js 팝업창 중앙정렬 가운데 위치시키는 방법 자바스크립트를 사용하여 팝업창을 원하는 위치에 띄우는 방법을 알아봅니다. 일반적으로 중앙에 팝업창을 많이 띄우므로 아래는 중앙에 정렬 기준으로 팝업창 띄우기를 알아봅니다.! 잠깐. 팝업창은 어디에 띄우는게 좋을까?띄우기 위한 방법을 알기 전에 어디 위치에 띄울 것인가 역시 중요합니다

  View : 48339 / 2016-09-01
  
• js [자바스크립트] 숫자 타입값에 콤마 추가하는 방법 '숫자 값에 콤마를 추가하여 나타내는 방법이 가능할까?'만약 화폐 단위나 필요에 의해 콤마를 사용해야 하는 경우가 있을 수 있습니다. 예를들어 1000이라는 값이 있다면 1,000처럼 표기하는 것이죠.! 어떻게 하면 자바스크립트 숫자에 콤마를 추가할 수 있을까?자바스크립트를 사용해 클라이언트에서 <span data

  View : 27374 / 2016-08-29
  
• js 제이쿼리 extend(), 객체 합치기 제이쿼리의 extend()는 다수의 객체를 하나의 객체로 합치는 merge기능을 수행할 수 있습니다. 만약 두 개 이상의 객체를 하나로 합치려는 경우 extend()를 사용하여 새로운 객체로 만들 수 있죠. 아래는 extend()</spa

  View : 24667 / 2016-07-25
  
• js 제이쿼리 data() 메소드 알아보기 ! 읽기 전에 참고하세요현재의 jQuery 버전에서는 data() 메소드의 사용 방법이 바뀌어 아래와 같이 사용하지 않습니다. data() 메소드의 기능이 이전의 data 속성을 읽는 것에서 data()를 사용하여 데이터를 저장할 수 있는 기능으로 바뀌었죠. 이에 대하여는 다음에 포스팅 하겠습니다.< 2019-01-10 ><br

  View : 5309 / 2016-07-25
  
• js toggleAttr 플러그인 만들기 제이쿼리에 있는 toggleClass() 메소드를 사용하면 편리하게 클래스명을 제어할 수 있습니다. 간단한 온오프 기능을 제공하죠. 하지만 속성(Attribute)을 간단하게 토글방식으로 제어할 수 있다면 이 역시 매우 편리할 것입니다. 하지만 이처럼 쉽게 제어가 가능한 toggleAttr()이 제이쿼리에는 없는데요... 그래서 플러그인(plu

  View : 1882 / 2016-07-21
  
• js ajax 타이머로 일정시간 단위로만 요청보내기 ajax 요청은 페이지 로딩 없이 데이터를 불러올 수 있다는 장점이 있다. 하지만 지나친 ajax 요청으로 데이터베이스 서버에 과부화를 줄 수도 있고 접속 인원이 많은 시간대에 데이터 트래픽이 과중될 경우 서버가 동작하는 않는 등의 문제가 생길 수 있을 것이다. 이런 문제는 아무리 데이터베이스 설계가 잘되있고 완벽한

  View : 4351 / 2016-07-15
  
• js [자바스크립트] 배열값 중 일부 삭제 또는 둘로 나누는 방법, splice 함수 자바스크립트에서 배열을 선언한 후 일부 배열을 삭제 또는 전체 배열을 삭제하는 방법에 대하여 알아보려고 합니다. 배열을 잘라내는 함수로 splice()를 사용할 수 있습니다. 또한 splice() 함수는 삭제뿐만 아니라 새로운 배열값을 원하는위치에 추가하는 것도 역시 가능합니다. 그럼 아래의 예제를 확인해보시기 바랍니다.[ 1 ] 배열 제거 또는 추가 함수, splice()<sp

  View : 11062 / 2016-07-05
  
• js [jQuery] toggleClass() 메소드 알아보기 제이쿼리의 toggleClass() 메소드 매우 자주 사용됩니다. 이 메소드를 사용하면 원하는 요소에 새로운 클래스를 추가하거나 제거하기를 매우 쉽고 간단하게 반복할 수 있습니다.toggleClass()는 설정된 클래스명을 해당하는 요소가 가지고 있는지 판단하여 해당 요소가 있으면 이를 제거합니다. 반대로

  View : 23236 / 2016-07-04
  
• js 제이쿼리ui dialog 모달 사용방법 자바스크립트의 제이쿼리ui에는 다양한 ui 플러그인이 존재하는데 이중에서 dialog 제이쿼리 ui 구현에 대하여 알아보자. 우선 다이얼로그를 만들게 되면 페이지에 팝업창을 띄우게 된다. 팝업창은 모달창 형태를 띄며 이를 만약 직접 만들 경우 시간 및 노력이 많이들지만 이 플러그인을 사용할 경우 매우

  View : 39159 / 2016-07-01
  
• js [자바스크립트] localStorage, sessionStorage 클라이언트에 정보 저장 웹에서 데이터를 저장하는 방법 중 서버가 아닌 클라이언트에서 가능한 방법을 알아보려고 합니다.웹사이트의 정보를 저장하기 위해서 반드시 서버가 필요한 것은 아닙니다. 사용 목적에 따라 클라이언트 저장소 역시 좋은 역할을 할 수 있습니다. 일반적으로 클라이언트 저장소를 생각하면 가장 먼저 쿠기 저장소를 떠올리겠지만 html5에는 좀 더 효과적인 클라이언트

  View : 76531 / 2016-06-24
  
• js [자바스크립트] console 객체에 대하여 알아보기 안녕하세요. 오늘은 console 객체에 대하여 알아보려합니다. console(콘솔 객체)가 가장 많이 사용되는 부분은 디버깅(debugging)할 경우가 많은데 이는 간편하게 출력정보를 확인하게 도와주기 때문입니다. console 객체는 몇 가지 유용한 메소드가 존재하며 이중에서도 많이 사용되는 log() 메소드는 특정정보를 인자로 넘겨주면 브라우저의 개발자 메뉴의 <span data-

  View : 6911 / 2016-06-19
  
• js [JavaScript] 함수의 예약어 return이란 ? 오늘은 자바스크립트 함수에서 사용되는 예약어 return에 대하여 알아보겠습니다. 사실 함수를 작성하면 매우 자주 사용되는데도 불구하고 예약어가 무엇이고 어떤 것을 하는지 잘 모르는체 그냥그냥 사용해온 사람도 있을 것입니다. 저 역시 처음에 그 기능을 잘 몰랐었습니다. 아래는 예약어 return의 역할이 무엇이고 어떤 때에 사용하는지 알아보고자 합니다.<span

  View : 19200 / 2016-06-18
  
• js [자바스크립트] 이벤트 버블링 제거방법 stopPropagation() 자바스크립트를 사용하여 이벤트를 구현할 때 발생가능한 문제점 중 하나로 이벤트 버블링 현상을 빼놓을 수 없을 것이다. 아래는 이벤트 버블링(Event Bubbling)이 무엇이고 왜 이런 문제가 발생하는지 알아볼 것이며 이를 해결하기 위한 방법에 대하여 예제를 통해 자세히 알아보고자 한다. 먼저 이벤트 버블링이 무엇인지 알아보자.이벤트 버블링이란이벤트 버블링은 보통 선택한 엘리먼트가

  View : 30342 / 2016-06-15
  
• js ajaxStart() ajaxStop() 사용방법 및 예제보기 비동기 방식(AJAX)을 사용한 웹사이트 구현시 제이쿼리의 ajax()메소드를 많이 사용한다. 이때 AJAX의 요청이 시작 또는 완료될 경우 특정한 메시지나 문구를 방문자에게 알림창 등의 방식으로 보여주기 위하여 ajaxStart() 그리고 ajaxStop()메소드를 사용할 수 있다. 먼저 이 두가지 메소드를 간단하게 설명하

  View : 9581 / 2016-06-13
  
• js [자바스크립트] 데이터 타입 상수란? 상수의 선언 및 특징 변수는 값을 저장하기 위해 가장 넓리 쓰이기 때문에 아시겠지만 상수는 모르시는 분들이 있을 것입니다... 이 상수는 변수와 다른 차이점을 가지는데요... 가장 큰 차이점이라면 상수는 변수와 달리 한번 설정하면 readonly 읽기만 하는 자료형을 말합니다. 다시말해 한 번 설정하면 절대 변하지 않는 값입니다. 그래서 가끔은 변수의 선언보다 상수가 더 유용할 수도

  View : 10324 / 2016-06-01
  
• js [자바스크립트] jQuery 마우스의 위치, 좌표 확인, event() 자바스크립트를 사용하여 마우스의 위치, 좌표값을 확인하는 방법에 대하여 알아보려합니다. 아래에서는 가장 간단한 방법인 제이쿼리를 사용해 알아보겠습니다# 제이쿼리를 사용하여 마우스 위치 알아내기 만약에 현재 마우스 커서가

  View : 43311 / 2016-05-31
  
• js [자바스크립트] switch 조건문 사용방법 자바스크립트에서 가장 많이 쓰이는 조건문(분기문)이 if문이겠지만 switch 역시 굉장히 많이 쓰이는 조건문 중 하나입니다. 조건문에 대하여 간단히 설명하자면.. 해당하는 조건이 맞는 경우에 정해진 구문을 실행하도록 만든 코드가 바로 조건문입니다.

  View : 34768 / 2016-05-30
  
• js [자바스크립트] 오늘 하루만 팝업 띄우기 자바스크립트를 사용해 팝업창을 띄우는 방법은 그다지 어렵지 않습니다. window 객체의 open() 메소드를 사용하여 원하는 팝업을 한개 또는 다수 띄울 수 있죠. 하지만 만약 오늘 하루... 24시간 동안 팝업을 띄우지 않을 경우에는 어떻게 해야할까요? 아래는 24시간 동안 팝업을 띄우지 않는

  View : 27140 / 2016-05-30
  
• js [자바스크립트] 난수, 랜덤 숫자 만들기 예제 자바스크립트를 사용하여 무의미한 랜덤한 숫자인 난수를 발생시키는 방법을 알아보고자 합니다. 먼저 난수(random number)는 왜 필요할까요? 난수는 다양한 곳에 활용할 수 있습니다. 그 경우는 굉장히 많으며 아래에서 자세히 알아보겠습니다.<span data-custom-style=

  View : 32647 / 2016-05-30
  
• js [JavaScript] 이전 페이지로 돌아가기, history.back(), history().go() 자바스크립트(Javascript)를 사용해 이전 페이지로 이동하기 위한 방법에 대하여 알아보고자 합니다. 어떻게하면 이전에 방문했던 페이지로 바로 이동이 가능할까요? 아래에서 확인해보세요.# 자바스크립트 이전 페이지로 이동하는 방법이 경우 자바스크립트 객체인 <spa

  View : 94951 / 2016-05-27
  
• js 자바스크립트 ajax 설명 및 예제보기 자바스크립트가 비동기방식의 ajax가 없었다면 꽃을 피웠다 얘기할 수 있었을까요? 재미있게 시작했지만 분명 자바스크립트에게 ajax, 비동기 방식의 호출은 가장 큰 발전의 계기가 되었음이 틀림없습니다... 아래는 이 중요한 ajax에 대하여 하나하나 알아보려합니다. 먼저, ajax가 무엇인지 알아보고 자바스크립

  View : 16152 / 2016-05-26