'Javascript'에 해당되는 글 32건
- 2010/05/15 초록별사랑 스크린리더 사용자를 위한 폼 검증 예제
- 2009/06/30 초록별사랑 자바스크립트로 Zooin, Zoomout하기
- 2009/05/19 초록별사랑 정규표현식 예제 정리 및 사용예
- 2009/05/16 초록별사랑 정규표현식에 대해 알아보자
- 2009/03/28 초록별사랑 FCKEditor초기 세팅방법
- 2009/03/26 초록별사랑 자바스크립트에서 현재페이지 reload하는 방법
- 2008/11/30 초록별사랑 prototype.js 한글문제
- 2008/07/29 초록별사랑 jQuery와 Prototype을 함께 사용하기
- 2008/07/28 초록별사랑 SW Quality Insight 정기세미나 참가 (1)
- 2008/07/09 초록별사랑 Ajax, 탈출구는 없다?!
화면확대
javascript:zoomIn();
원래대로
javascript:zoomOr(0)
화면축소
javascript:zoomOut();
단지 IE에서만 된다는것.. ^^
그럼. 어떠한 정규표현식이 있는지 알아보자
스팸을 보내는 스패머의 IP 주소를 차단하기 위해 .htaccess 파일에 적어 줄 때 많이 사용하는 정규식이다.
/([0-9]{1,3}).([0-9]{1,3}).([0-9]{1,3}).([0-9]{1,3})/
IP 주소의 숫자 부분을 그룹화 한 이유는, 이를 이용해서 다른 문자로 치환할 때 사용하기 위해서이다.
방법 1. /[a-z|A-Z|0-9]+@(naver|daum|hanmail|nate|hotmail|yahoo|gmail|hitel|paran|dreamwiz|lycos).(com|net|co.kr)/
방법 2.
Not : /(@.*@)|(\.\.)|(@\.)|(\.@)|(^\.)/
/^[a-zA-Z0-9\-\.\_]+@[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,3})$/
방법 1. /^0\d{1,2}-\d{3,4}-\d{4}$/
방법 2. /[0-9]{2,4}-[0-9]{3,4}-[0-9]{4}/
HTML 문서를 텍스트 에디터로 열어 편집할 때 하이퍼링크만 검색하기 위한 정규식이다.
/(<a href=['"]*[^'"]+['"]*[^>]*>)([^>]*)(</a>)/
a 대신 span, div 등을 넣어서 다른 태그를 검색할 수도 있다.
URL을 검색하기 위한 정규식이다.
/(mms|http|HTTP|ftp|FTP|telnet|TELNET)://(.[^<"')]+)/
/^\d+$/
this.replace(/^\s+/, '').replace(/\s+$/, '');
this.replace(/<\/?[^>]+>/gi, '');
/^\w+$/
/^\W+$/
참고 : http://heuristing.net/index.php?pl=1132
prototype.js
위 사이트와 prototype.js 그래고 내가 만든거 몇개 해서 정리, 아직도 정리해야할 많은 부분이 있겠으나 오늘은 여기까지만 정리하고자 한다.^^
- 문자열을 검색하기 위한 기준을 설정하고 이를 검색하는 일련의 과정
- 문자들의 패턴을 기술하는 객체
정규표현 작성방법정규 표현식(正規表現式, Regular expression, 줄여서 Regexp 또는 Regex)은 특정한 규칙을 가진 문자열의 집합을 표현하는 데 사용하는 형식 언어이다. 정규 표현식은 많은 텍스트 편집기와 프로그래밍 언어에서 문자열의 검색과 치환을 위해 지원하고 있으며, 특히 펄과 Tcl은 언어 자체에 강력한 정규 표현식 구현을 내장하고 있다.
정규 표현식은 컴퓨터 과학의 정규 언어로부터 유래하였으나 구현체에 따라서 정규 언어보다 더 넓은 언어를 표현할 수 있는 경우도 있으며, 심지어 정규 표현식 자체의 문법도 여러 가지 존재하고 있다. 이 중 표준화된 것으로는 POSIX의 확장 정규 표현식이 있으며, 표준화되지는 않았지만 펄의 정규 표현식과 그 대체 구현인 PCRE도 널리 사용된다.
------------- 위키피디어
- 패턴을 메서드의 아규먼트에 지정하는 방법
- 패턴을 변수에 할당하고 이를 오브젝트로 하여 메서드를 실행하는 방법
- RegExp오브젝트 생성자를 사용하여 오브젝트를 생성하고 메서드를 실행하는 방법
- i (ignoreCase) : 대소문자를 구분하지 않고 검색, 매치되면 더 이상 검색하지 않고 매치된 문자열을 반환
- g(global) : 문자열에서 패턴과 매치되는 모든 문자열을 배열로 변황
- m(multiline) : 문자열이 복수 라인으로 구성된 경우 전체 라인을 검색
| 오브젝트 / 클래스 | 메서드 | 메서드 기능 |
| String 클래스 | match | 문자열을 매치 검색, 매치가 되면 배열을 반환, 매치되지 않으면 null을 반환 |
| replace | 문자열을 매치 검색, 매치된 문자열을 치환 | |
| search | 문자열을 매치 검색, 매치되면 매치된 인덱스를 반환, 매치되지 않으면 1을 반환 | |
| split | 정규 표현 또는 문자열을 사용하여 검색 대상 문자열을 분할하고 배열화 | |
| RegExp 오브젝트 | exec | 문자열을 매치 검색, 매치가 되면 배열을 반황하고 매치되지 않으면 null을 반환 |
| test | 문자열을 매치 테스트, 매치되면 true를 반환하고 매치되지 않으면 false를 반환 |
| 매치 위치 | |
| 특수 문자 | 기능개요 |
| ^ | ^(캐럿)은 문자열의 첫 문자와 패턴을 매치한다. 매치하면 문자열을 반환하고 매치하지 않으면 null을 반환한다. |
| $ | 문자열의 마지막 문자와 패턴을 매치한다. 매치하면 문자열을 반환하고 매치하지 않으면 null을 반환한다. |
| 수량자 | |
| 특수문자 | 기능개요 |
| + | +좌측에 지정한 문자와 같으면서 +직전의 문자가 +우측에 연속하여 있으면 숫자에 관계없이 전부 추출하여 변환한다. 즉 +직전의 문자를 포함하여 매치 검색을 실행하고 +직전의 문자로 우측 매치를 실행한다. |
| * | *직전의 문자를 제외하고 좌측에 있는 문자가 매치되어야 하고 *직전의 문자가 있어도 되고 없어도 되지만, 있으면 이름 반환. |
| ? | ?직전의 문자를 제외하고 왼쪽에 있는 문자가 매치되어야 하고, ?오른쪽의 문자는 검색하지 않는다. 즉?직전의 문자를 포함하지 않고 왼쪽만 매치 |
| {} |
사용법 : {p} p는 양의 정수, {}안에 지정된 수만큼 같은 문자에 매치하면 매치한 것을 반환한다. 나머지가 있을 때에는 매치된 수만큼만 제외하고 다시 매치 검색을 행한다. |
| {.} |
사용법 : {p.} p는 양의 정수. {.}안에 지정한 수만큼 같은 문자에 매치하면 매치한 문자가 포함된 단어 전체를 반환한다. 그리고 스페이스 다음의 문자부터 다시 검색을 행한다. |
| {p,m} |
사용법 : A{p,m} p와 m은 양의 정수, p는 최소값이고 m은 최대값이다. 최소부터 최대사이에 매치되면 매치된 것을 반환한다. 나머지가 있을 때에는 매치한 수만큼을 제외하고 다시 매치 검색을 행한다. |
| 옵션, 캡처, 백슬래시, 점, 클래스 | |
| a|b | a또는 b를 매치, a가 매치되면 b는 매치하지 않는다. |
| \ | 백슬래이에는 두가지 형태가 있다. 특수기능을 해제하고 텍스트 문자로 변환하는 것과 반대로 \로 시작하는 특수문자 |
| () | 괄호 안에 지정한 값을 매치하고 매치되면 괄호 안의 값을 $에 캡처, 배열로 기억되므로 인덱스를 사용하여 접근 가능 |
| (?:A) | A를 매치하며, 매치되지않더라도 이를 기억(캡처)하지 않는다. |
| A(?=B) | A에 연속하여 B가 올때만 A에 매치 |
| A(?!B) | A에 연속하여 B가 오지 않을 때만 A에 매치 |
| [A] |
[A]에 포함된 문자를 매치, [시작-끝]형태로 범위를 지정할 수 있다. [12345]->[1-5]로 표현 가능 |
| [^A] |
[A]에 포함되지 않는 문자ㅡㄹ 매치. [시작-끝]형태로 범위를 지정할 수 있다. [^12345] -> [^1-5]로 표현 가능 |
| \ 특수문자 | |
| \0 | null 문자 |
| \b | 공백 또는 줄 바꿈을 기준으로 매치 |
| \B | 공백 또는 줄 바꿈 이외를 기준으로 매치 |
| [\b] | 백스페이스(특수한 경우) |
| \cK | K는 제어문자, 문자열에서 제어문자를 매치 |
| \d | 숫자를 매치한다.[0-9]와 같다 |
| \D | 숫자 이외의 문자에 매치한다.[^0-9]와 같다 |
| \f | 폼 피드에 매치 |
| \n | 라인 피드에 매치 |
| \r | 캐리지 리턴에 매치 |
| \t | 수평 탭에 매치 |
| \v | 수직 탭에 매치 |
| \s |
화이트 스페이스(스페이스, 탭, 폼피드, 라인피드)문자에 매치 [\f\n\r\t\v] |
| \S |
화이트 스페이스 이외의 문자에 매치 [^\f\n\r\t\v\u00A0\u2028\u2029] |
| \w |
영문, 숫자, 언더라인 문자에 매치 |
| \W | 영문, 숫자 언더라인 이외의 문자에 매치 |
| \ohh | 8진수 hh문자에 매치 |
| \xhh | hh(16진수 2자리)문자에 매치 |
| \uhhhh | hhhh(16진수 4자리)문자에 매치 |
정규표현식은 문자열을 얼마나 효율적으로 사용하는가에 대한 모든것을 보여준다.
아직도 배울게 많고 이해안가는 부분이 많아서 이렇게 정리하고 차근차근 이해해 나가야 할것이다. 미천하지만 정리하면서 많이 이해를 할수 있던거 같다. 좀더 자유자재로 정규표현식을 사용하기 위해 갈고 닦아야 할 것이다.
최근 FCKEditor를 2.4X버전에서 플래시로 업로드 하는 문제 땜시 2.64로 업데이트를 했다.
업데이트를 하면서 초기설정을 어떻게 변경해야하는지 기억이 안나서 한참을 해맸다. ㅠㅠ
이제 문서로 작성해두면 다음업그레이드에서는 별 문제없이 할수 있으리라고 생각한다.
1. fckconfig.js수정사항
FCKConfig.DefaultLanguage = 'en' ;
-> FCKConfig.DefaultLanguage = 'ko' ;
FCKConfig.ToolbarSets
-> 기존설정을 만들어 놓은것 복사
asp프로그램을 사용한다고 체크
var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py
-> var _FileBrowserLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py
-> var _QuickUploadLanguage = 'asp' ; // asp | aspx | cfm | lasso | perl | php | py
이부분 설정하는 방법을 잊어버려서 프로그램이 안되서 한참을 해맸다. 반드시 사용하는 프로그램으로 변경해야한다. 이부분만 변경하면 일반적으로 사용하는데는 문제가 없다.
링크브라우저 삭제
FCKConfig.LinkBrowser = true ;
-> FCKConfig.LinkBrowser = false ;
이미지 브라우저 삭제
FCKConfig.ImageBrowser = true ;
-> FCKConfig.ImageBrowser = false;
플래시 브라우저 삭제
FCKConfig.FlashBrowser = true ;
-> FCKConfig.FlashBrowser = false;
링크 업로드 삭제
FCKConfig.LinkUpload = true ;
-> FCKConfig.LinkUpload = false;
이미지 설정 자세히 탭 삭제
FCKConfig.ImageDlgHideAdvanced = false ;
-> FCKConfig.ImageDlgHideAdvanced = true ;
플래시 설정 자세히 탭 삭제
FCKConfig.FlashDlgHideAdvanced = false ;
-> FCKConfig.FlashDlgHideAdvanced = true ;
2. config.asp수정사항
ConfigUserFilesPath = "/userfiles/"
-> ConfigUserFilesPath = 해당업로드 root로 설정
// 한글파일업로그에 문제갈 발생해서 항상 새로운 파일명으로 저장하도록 수정한다.
sFileName = SanitizeFileName( sFileName )
-> sFilename = 새로운 파일이름
위의 내용을 수정하고 에디터를 업그레이드하면 문제없이 사용할 수 있다.
참고 : http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide
현재 웹페이지를 다시 읽어오는 것이다.
일반적인 다시 읽기
window.location.reload();
이렇게 하면 컴퓨터의 캐쉬에서 우선
파일을 찾아봅니다. 없으면 서버에서 받아옵니다.
적극적인 다시 읽기
window.location.reload(true);
true 라는 파라미터를
입력하면, 무조건 서버에서 직접 파일을 가져 오게 됩니다. 캐쉬는 완전히 무시됩니다.
소극적인 다시 읽기
history.go(0);
이렇게 하면, 캐쉬에서 현재 페이지의 파일들을 항상
우선적으로 찾습니다.
출처 : http://neouser.tistory.com/tag/reload
그런데 한글로 QueryString을 보내면 한글문제가 발생하는 것이다.
다양한 삽질끝에.. 발견한것..
return key + '=' + encodeURIComponent(String.interpret(value));
를 아래로 대체
return key + '=' + String.interpret(value);
var key = encodeURIComponent(pair.key), values = pair.value;
를 아래로 대체
var key = pair.key, values = pair.value;
위의 두개에서 encodeURIComponent()를 빼고 하였더니 문제없이 한글이 보내졌다..
다른 분들에게 도움이 될지는 모르겠으나. 로그를 남긴다.
Prototype은 널리 사용하는 라이브러리이며 jQuery는 빠르게 성장하고 있다. 페이지 제작자들이 이 두 라이브러리의 장점을 살려 동일한 페이지에서 두 라이브러리를 모두 사용하고 싶을 수도 있다.
일반적으로 jQuery는 모범벅으로 가이드 라인을 지키고 있으며 전역 네임스페이스를 함부로 사용하지 않고 있다. 하지만 충돌하는 곳이 한 군데 있는데, 앞에서 언급한 적이 있는 $전역 이름이다.
하지만 jQuery는 잘 작성된 좋은 라이브러리로, 이점을 이미 예상하고 있다. 같은 페이지에서 Prototype과 jQuery를 함께 사용하려면, 라이브러리가 로드된 이후 아무때나 jQuery의 유틸리티 함수인 jQuery.noConflict()를 호출해 주면 된다. 이렇게 하면 $이름의 기능을 Prototype정의로 되돌린다.
jQuery 기능은 jQuery네임스페이스를 통해 접근할 수 있다. 혹은 여러분만의 별맃ㅇ을 쓸 수도 있다. jQuery문서는 Prototype과 함께 사용할 때 다음과 같은 별칭을 선언하여 사용하도록 권고하고 있다.
var $j = jQuery;
Or
j$ = jQuery.noConflict();
j$("div").addClass("a");
출처 : Ajax인 프랙티스
좀더 많은걸 보려면 여기를 방문하면 된다.

위와같이 SW Quality Insight 정기세미나 참가 메일이 와서. 어떤가 한번 보려고 신청하기 버튼을 클릭하였더니. 한국소프트웨어진흥원으로 링크가 이동한다.
내가본 브라우저는 파이어폭스였는데 아이핀을 하려고 하는데 안되어서 황급히 인터넷 익스플로어로 갈아타게 되었다. 어차피 항상 2개의 브라우저를 띄워놓고 사용하는 나로서는 별반 문제가 없었다.
하지만 .. 참석하기 버튼을 클릭하니 회원정보가 필요하단다.. 내참.. 그냥 받으면 안되나? 하는 생각이 있었지만 그래도 회원정보가 필요하다잖아.. 그래서. 화면에 보니 공인인증서로긴도 있어 공인인증서로 로긴을 하려고 시도.. 몇가지 프로그램을 설치하고 공인인증서 비밀번호를 넣었더니. 은행에서 쓰는건 안된단다.. 내참.. ^^;
그래서 회원가입을 하려고 회워가입버튼을 클릭 회원가입여부 확인이 뜬다. 거기에 보니 가상 주민등록번호가 있어서 클릭했더니 팝업창이 뜨면서 아이핀이 나온다. 그래서 예전에 아이핀을 발급받은 기억이 있어서 아이핀을 하려고 아이디 비밀번호 찾기를 했다. 아이디 찾기를 했더니 내 아이디가 나온다. 그래서 비밀번호 찾기를 클릭했던 이메일을 입력하란다 그래서 이메일을 입력하고 클릭하니 이멜로 비밀번호를 전송했단다..
그래서.. 메일로 적은 이멜을 계속확인하는데도.. 비밀번호는 내게 올줄 모른다.
어쩌겠는가. 힘없는 유저는 다시 일반 주민등록번호로 가입을 하고 로긴을 했다.
그리고 첫화면에서 교육신청으로 가는 게시물로 가야하는데. 쩝. 이번에는 자바스크립트 에러가 나서 계속 경고창만 뜨는것 아닌가?
이게 우리나라 소프트웨어의 현실이구나.. 하는 생각을 하니 안타까운 현실에 웹 개발자인 내가 화가 난다.
우씨. 좀 제대로 해봐라.. ^^; 가뜩이나 날도 더운데.. 도대체 아이핀은 정상적으로 작동하는게 맞는지. 자바스크립트는 제대로 만들어 놓은게 맞는지 게시물 하나 읽으러 가는데 자바스크립트 에러때문에 게시물을 못읽는다는게 말이 되나고.. ^^
하여간 신청했으니 가서 들어봐야 겠다. 아 어렵다..
문제점.
1. 파이어폭스에서 안된다. (오페라나 사파리는 안써서 모르겠다. 하지만 당근 안될것 같다)
2. 은행공인인증서로는 로긴할수 없다.
3. 아이핀은 사용하고 싶어도 비밀번호를 모르면 사용할 수 없다.(비밀번호 찾기를 해도 메일이 안온다.)
4. 정작 로긴을 하면 자바스크립트 에러때문에 신청게시물로 들어가기도 어렵다

글
댓글을 달아 주세요
댓글 RSS 주소 : http://haroc.haroc.net/tc/rss/comment/473