카테고리 보관물: Front-End Development

이메일 템플릿 만들기

본 가이드는 이메일 템플릿을 쉽게 제작 할 수  있는 서비스를 소개하고 유의 할 점들을 공유 합니다.
 
[이메일 템플릿 만들기를 도와주는 무료 서비스]
[작업시 유의사항]
  1. HTML작업시 Table 마크업! (기존 레이아웃 잡는 Block 요소 인식 못하는 이메일 클라이언트 서비스 때문)
  2. 스타일 시트를 별도 파일로 구성하면 인식 못하는 메일 서비스도 있기때문에 페이지내 포함하거나, Inline으로 작성한다.
  3. 작업후 서비스별 이메일 클라리언트의 랜덩링이 다르기 때문에 테스트 가능한 메일 서비스는 모두 테스트 한다.
  4. 메일별 결과 체크 리스트를 만들어서 브라우저별 서비스별 테스트 진행해야 한다.
[국내 필수 테스트 메일]
  • 다음, 네이버, 네이트, 구글, 아웃룩
[참고]

Mobile Safari 에서 Label 클릭이 안되는경우 해결방법.

https://bugreport.apple.com 에 리포팅된 버그이며, IOS 또는 iPhone4의 Safari버전에서 흔히 나타난다고 한다.
모바일에서 Label DOM 요소 클릭이 안될땐 빈 함수를 실행해주면 신기하게도 동작한다.

$('label').click(function() {});

최신버전의 Safari에서는 문제 없다.

[관련글]
http://stackoverflow.com/questions/7358781/tapping-on-label-in-mobile-safari

CORS 설정해도 IE에서 크로스 도메인간 요청 불가 원인.

[CORS 설정에도 IE9 요청 불가 콘솔 로그.]

JSONP를 사용하지 않아도 크로스 도메인간 데이터 송 수신을 가능하게 해주는 스펙이 CORS입니다.
하지만 CORS (Cross-Origin Resource Sharing) 는 XHR Level2에서 지원하는 스펙이기 때문에,
최신 파폭, 크롬, IE 10이상은 문제 없이 지원하지만, IE하위 버전에선 동작하지 않습니다.
제한적으로 IE에만 있는 XDomainRequest을 사용하는 방법을 소개하는 글도 있지만,
이 또한 IE 8, 9에만 제한되며, 그 이하 버전도 만족하려면 JSONP를 요청 응답을 사용해야 합니다.

관련글은 아래와 같습니다.

Summary of XHR2 CORS (or rather lack of) in Internet Explorer

  • IE 6, 7, 8, and 9 do not support XHR2 CORS. It is not possible to make generalized cross-domain requests in these browsers.
  • IE 8, 9 support an ActiveX control called XDomainRequest that only allows limited cross-domain requests compared to XHR2 CORS.
  • IE 10 supports XHR2 CORS.

[관련링크]
– https://github.com/WardCunningham/Smallest-Federated-Wiki/issues/365

자바스크립트에서 replace를 replaceAll 처럼 사용하기

자바스크립트에서 replaceAll 은 없다.
정규식을 이용하여 대상 스트링에서 모든 부분을 수정해 줄 수 있다.

[replace 이용]

// #를 공백으로 변경한다.
str.replace("#","");

하지만 첫번째 # 만 공백으로 변경되고 나머지는 변경이 되지 않는다.

 

[정규식 이용해서 gi 로 감싸기]

// 정규식을 사용하여 gi 옵션을 붙이면 replaceAll 과 같은 결과를 볼 수 있다.
str.replace(/#/gi, "");

 

[정규식의 gi 설명]
* g : 발생할 모든 pattern에 대한 전역 검색
* i : 대/소문자 구분 안함
* m: 여러 줄 검색 (참고)

 

[출처]
http://blog.naver.com/PostView.nhn?blogId=sjpotato&logNo=40150731304&redirect=Dlog&widgetTypeCall=true