화요정규식 – 1주차 : 반복단어 강조

우연히 Regex Tuesday라는 재미있는 사이트를 하나 발견했습니다. 매주 화요일에 정규식 문제를 올려두고 이를 바로 확인해 볼 수 있도록 만들어진 사이트입니다. 평소에 정규식에 관심도 많고 문제를 푸는 것도 재미있고 해서 시간나는 대로 이 사이트에 나온 문제에 대한 제 답과 해설을 달아볼 생각입니다. 순전히 제가 재미있자고 하는 일이지만 정규표현식을 공부하는 분들에게도 도움이 되었으면 하는 바람입니다. 1주차 문제는 …

모바일 웹에서 네이티브 앱 실행하기

종종 구글, 네이버 등의 사이트에서처럼 모바일 웹과 네이티브 앱을 동시에 지원하는 서비스가 있다. 이 때, 모바일 웹에서 특정 기능을 사용할 때 모바일 앱을 열거나 설치되어 있지 않다면 설치 링크로 바로 보내는 기능을 제공할 수 있다. 예를 들어, 네이버 모바일 웹은 사용자가 받아쓰기 버튼을 클릭하면 네이버 앱을 실행시킨다. 앱이 설치되어 있지 않다면 설치 페이지로 이동시킨다. 이 …

[코딩팁] JS 함수 리터럴을 실행하는 방법

자바스크립트에는 다음과 같이 표현하는 함수 리터럴이 있습니다. 함수 리터럴은 다른 함수에 인수로서 사용되기도 하지만, 독립적으로 실행되기도 합니다. 독립적으로 실행할 때는 주로 다음과 같이 함수 리터럴 양쪽을 괄호로 감싼 후 다시 괄호 한 쌍을 추가해주는 방식을 주로 사용합니다. 여기서 함수 리터럴을 감싸는 괄호가 없으면 에러가 발생하기 때문에 괄호는 반드시 필요합니다. 하지만, 괄호가 너무 많아서 보기에 좋지 …

예제로 배우는 자바스크립트 1 – 문서에 포함하는 방법

<script type=”text/javascript”> alert(1); </script> 자바스크립트를 문서에 포함할 때는 <script>를 사용합니다. 웹 브라우저는 여는 <script>와 닫는 </script> 사이에 작성된 코드를 자바스크립트 엔진으로 전달하고, 엔진은 자바스크립트 코드를 해석하고 실행합니다. type 속성 HTML5 이전에는 <script>요소에는 type 속성은 반드시 필요했습니다. HTML5 부터는 type 속성을 생략할 수 있으며 생략하면 text/javascript가 기본값으로 사용됩니다. 그러나 HTML5는 여전히 초안 상태이므로 아직까지는 type 속성을 …

DOM2 Range를 사용한 pasteHTML 구현

Range 객체는 문서에서 선택된 영역의 데이터를 추출하거나 조작할 때 사용하는 객체입니다. 인터넷 익스플로러를 제외한 대부분의 브라우저는 DOM Level2에 정의된 Range 스펙을 따르고 있습니다. DOM은 표준 스펙이지만, IE TextRange의 pasteHTML 메소드를 사용할 수 없다는 점은 아쉬운 부분입니다. 예를 들어, IE에서는 다음과 같이 선택 영역의 텍스트를 치환하거나 새로운 텍스트를 삽입할 수 있었습니다. var sel = document.selection; if (sel) …