[RahXePhon] 하쿠나 마타타~

1. JQuery 얻기 먼저 JQuey를 다운받는다. JQuery 사이트에가서 JQuery를 다운받는다. 다운로드 페이지는 여기에 있다. 압축된 버전(Compressed)과, 압축되지 않은 버전(Uncompressed)이 있는데 특별한 이유가 없다면 압축된 버전을 받는다. (마우스오른쪽 클릭, 다른이름으로 저장). 2. 처음해보는 JQuery프로그래밍 _1 lecture1 폴더를 만든다 _2 폴더안에 다운받은 JQuery파일을 넣는다. (예_ jquery-1.1.2.pack.js) _3 lecture1.html를 만들고 각각 다음 내용을 복사해 넣는다. 1) lecture1.html aaa1|bbb1|ccc1 aaa2|bbb2|ccc2 aaa3|bbb3|ccc3 4. lecture1.html을 브라우저에..

프로그래밍/스크립트 2009. 5. 26. 21:55

1. 웹 환경의 변화와 새로운 기술의 요구 이제까지 자바스크립트는 웹브라우저쪽에서 폼처리등의 간단한입력처리등 을 하는데 주로 사용되어 왔고 이것은 현재도 대체적으로 사실 입니다. 한때 DHTML등이 인기를 끌면서 한때 자바스크립트가 부각된 적도 있었지만. 양대 부라우저의 호환성문제와 플래시등의 새로운 미디어의 등장으로 자바스크립트의 중요성은 상대적으로 적어졌습니다. 어짜피 웹프로그래밍에서 서버용프로그래밍을 배제할 수 없는 상황에서 양쪽 프로그래밍(서버쪽과, 브라우저쪽)을 병행하는 것이 피곤한 일이라는 것 도 또한 현실적인 이유가 되었을 것입니다. 하지만 한편으로 웹의 환경은 계속 변해서 이제 그 변화는 Web2.0이나 AJax, OpenApi, 메쉬업 등의 용어들이 어느새 익숙해 질 만큼 구체적이 되었습..

프로그래밍/스크립트 2009. 5. 26. 21:54

2. JQuery 를이용한 AJax시작하기 이번에는 1. JQuery 시작하기에서 만들어본 내용에서 데이타를 TEXTAREA에 넣어보도록 했던 부분을 JQuery의 AJax기능을 이용하여 외부파일 data.txt를 열어서 TABLE을 만들도록 수정해 보겠다. 이 데이터를 php,jsp,asp등을 이용해 동적으로 만들어주면 간단하게 MVC모델을 적용하여 프로그래램을 작성할 수 있을것이다. _1 lecture2 폴더를 만든다 _2 폴더안에 다운받은 JQuery파일을 넣는다. (jquery-1.1.2.pack.js) * 다음부터 여기까지 과정은 생략하도록 하겠다 _3 lecture2.html과 data.txt를 만들고 각각 다음 내용을 복사해 넣는다. 1) lecture2.html 2) data.txt aaa..

프로그래밍/스크립트 2009. 5. 26. 21:52

JQuery Core JQuery 객체 만들기 1 $( html ) html을 JQuery Object로 만든다. 예) $("안녕하세요").appendTo("body"); 2 $(elems) 자바스크립트 엘리먼트나 엘리먼트 배열을 JQuery 오브젝트로 만든다. 예) $(document.body).html("으흐흐."); $(document.form1).html("으흐흐."); 3 $( expr, context ) 표현식과 context를 이용하여 JQuery객체를 만든다. 표현식은 여기서 설명해 두었다. 4 $( fn ) $(document).ready()의 짧은 표현이며, 일반 자바스크립트의 document.onload=function(){..}와 대응된다. 예) $(function(){ //여기에 ..

프로그래밍/스크립트 2009. 5. 26. 21:50

AJAX를 이용하면 PHP등의 서버쪽 기술을 이용하지 않고 HTML에 동적으로 다른 문서를 넣을 수 있습니다. HTML문서에 다음과 같은 DIV요소가 있을경우. $("#data").load("data.html"); 이렇게하면 data.html을 불러들입니다. (정말 간단하지요..) 이때 data.html은 utf-8인코딩이어야 합니다.

프로그래밍/스크립트 2009. 5. 26. 21:42

개인적으로 JQuery의 AJAX기능은 주로 load,get,post 정도를 많이 사용하고 실행환경에서 모든 페이지는 utf-8로 하고있습니다. (euc-kr은 골치아픈 문제들이 계속따라 다니기 때문에 가능하면 utf-8이 작업하기 좋구요.) load함수는 다른 글에서 설명했고. 여기서는 사용법이 비슷한 get과 post를 설명하겠습니다. 다른 jquery 기능처럼 간단합니다. 1. 기능 jquery의 get함수는 html폼 객체에서 method를 get으로하고 form의 submit()을 실행하는 것 과 같은 기능입니다. 마찬가지로 post함수의 경우는 method가 post입니다. 폼을 이용한 경우와 다른것이 있다면, 페이지를 ajax기술을 이용한 만큼 페이지를 새로고치지 않는것과, 데이터를 로딩하면..

프로그래밍/스크립트 2009. 5. 26. 21:26

Ajax 사용하기 출처 : http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery#Rate_me:_Using_Ajax 다음은 jQuery에서 Ajax를 사용하는 예제인데 http://jquery.bassistance.de/rate.phps 페이지에 접근하여 average와 count를 가져오는 예제임. $(document).ready(function() { // 마크업 생성 $("#rating").append("Please rate: "); for ( var i = 1; i

프로그래밍/스크립트 2009. 5. 15. 17:02

출처 : http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery jQuery에서는 document의 ready 이벤트를 다음과 같이 등록한다. $(document).ready(function() { // DOM이 준비된후 할일 정의 }); 링크를 클릭했을 때 경고창으로 메시지를 띄우는 예제. $(document).ready(function() { $("a").click(function() { alert("Hello, world!"); }); }); $("a")는 jQuery의 선택자(selector)이며 $는 jQuery의 클래스이므로 $()는 새로운 jQuery 객체를 생성하는 코드임. click은 jQuery 객체의 메소드로서 클릭 이벤트와 바인딩..

프로그래밍/스크립트 2009. 5. 15. 17:01

prototype.js를 위한 개발자 노트 목차 Prototype은 무엇인가.? 관련글 utility 함수 $() 함수 사용하기 $$() 함수 사용하기 $F() 함수 사용하기 $A() 함수 사용하기 $H() 함수 사용하기 $R() 함수 사용하기 Try.these() 함수 사용하기 String을 향상시키기 문자열 대체 문자열 템플릿 Ajax 객체 Ajax.Request class 사용하기 Ajax.Updater class 사용하기 What are all those "?" and squares? 열거(Enumerating)... 루프, 루비-스타일 스테로이드(steroids)에서 당신의 배열 내가 강력하게 추천하는 책들. prototype.js 참조 JavaScript classes를 위한 확장 Object..

프로그래밍/스크립트 2009. 5. 13. 14:32

jQuery 개발자를 위한 메모 - 레퍼런스 레퍼런스 $() jQuery 오브젝트를 만들어 내는 함수입니다. $("CSS/Xpath 문자열") CSS/XPATH 그리고 요소를 지정해, 매치한 요소를 가진다jQuery 오브젝트를 돌려줍니다. 자세한 지정 방법은 CSS / XPath (을)를 참조해 주세요. var $toc_1 = $("#toc_1"); jquery_dump($toc_1); var $h1 = $("h1"); jquery_dump($h1); var $h1head = $("h1.head"); jquery_dump($h1head); var $ahref = $("a[@href='http://jquery.com/']"); jquery_dump($ahref); var $h1pa = $("//p/a");..

프로그래밍/스크립트 2009. 5. 11. 16:51

출처 : http://xguru.net/blog/503.html AJAX 가 웹 기술의 대세로 떠오르면서, Javascript 언어에 대해 새로운 접근들이 시도되고 다양한 AJAX 및 자바스크립트 라이브러리들이 출시되었습니다. 많이 쓰이니까 쉽게 쓸 수 있도록 하는 방법들이 나오는 건 당연하겠죠. Script.aculo.us, Prototype.js , MooTools , jQuery, YUI ( Yahoo UI Library ) 등등.. 수 많은 Javascript 라이브러리중 최근의 대세는 jQuery - http://jquery.com/ 입니다. Google Trends를 통해서 위의 Script 라이브러리들을 비교해보면 이렇습니다. http://google.com/trends?q=jquery+%2..

프로그래밍/스크립트 2009. 5. 11. 14:41

Michael Abernethy, 제품 개발 관리자, Optimal Auctions 옮긴이: 박재호 이해영 dwkorea@kr.ibm.com 2008 년 11 월 18 일 jQuery는 동적 RIA(Rich Internet Application)를 쉽게 만들기 위해 개발자가 고려하는 자바스크립트 라이브러리로 뜨고 있습니다. 브라우저 기반 응용은 데스크톱 응용을 계속해서 대체하고 있기에, 이런 라이브러리는 계속해서 활용 범위가 넓어질 것입니다. jQuery 연재물을 통해 jQuery 관련 지식을 얻고 웹 응용 프로젝트에 활용하는 방법을 익혀봅시다. 도입 jQuery는 웹 개발자를 위한 라이브러리 선택 과정에서 다른 자바스크립트 라이브러리 옵션과 간격을 벌리기 시작했으며, 클라이언트 쪽 개발을 쉽게 도와주며..

프로그래밍/스크립트 2009. 5. 11. 14:35

이 글은 번역한 것입니다. 원문은 여기에서 확인하실 수 있습니다. 겸손한 자바스크립트를 구현하기엔 jQuery가 가장 적절하고 바람직하다는 생각에 옮겨봅니다. 저도 Quark씨처럼 당장의 편리함을 따른 것보다 jQuery의 철학을 따르는 것이 더 바람직하다고 생각합니다. 항상 디커플링을 지향하는 것이 생산성 문제를 개선하고 미래에 적응하는 것을 가능케 하기 때문입니다. 오역된 부분이 있을 지도 모르겠습니다.-_-;; 교과서 영어가 아니라-_-;; 나름대로 의역을 하긴 했는데 어렵네요. ----여기부터는 번역입니다. jQuery는 겸손한(unobtrusive) 자바스크립트를 위한 자바스크립트 라이브러리다. jQuery는 태생적으로 Behavior driven development 방법론을 지향하고 CSS ..

프로그래밍/스크립트 2009. 5. 11. 14:27

Jesse Skinner, Web Developer, Freelance 2007 년 9 월 04 일 jQuery는 JavaScript 라이브러리로서 JavaScript™와 Asynchronous JavaScript + XML (Ajax) 프로그래밍을 단순화 하는데 도움이 됩니다. JavaScript 라이브러리와는 달리, jQuery는 복잡한 코드를 간결하게 표현할 수 있는 독특한 철학이 있습니다. jQuery 원리, 기능과 특징을 배우고, 일반적인 Ajax 태스크도 수행하며, 플러그인으로 jQuery를 확장하는 방법도 알아봅니다. jQuery란 무엇인가? 2006년 초, John Resig가 만든 jQuery는 JavaScript 코드로 작업하는 사람들에게는 훌륭한 라이브러리이다. 여러분이 JavaScr..

프로그래밍/스크립트 2009. 5. 11. 14:12

HTML 표준에 따르면 각각의 HTML 문서는 문서 형식을 선언할 필요가 있습니다. DOCTYPE 혹은 Document Type Declaration이라고 합니다. 태그로 시작하는 이러한 선언은 브라우저 혹은 HTML 문법 검사기에게 어떤 판번호(Version)의 HTML로 작성된 페이지인지를 알려주게 됩니다. IE(Internet Explorer)에서는 DOCTYPE에 따라 박스 모델을 해석하는 방법 이 다르기 때문에 동일한 화면 구현물을 얻기 위해서 필히 명시해 주어야 합니다. 아래는 웹 페이지에 사용되는 일반적인 문서 형식을 정리한 것입니다. HTML 2.0 view plaincopy to clipboardprint? HTML 2.0 은 대다수의 브라우저가 지원하는 문서 형식입니다. 시작적으로 보여..

프로그래밍/스크립트 2009. 5. 7. 09:25

프로그래밍/스크립트 2009. 3. 9. 18:01