알쓸전컴(알아두면 쓸모있는 전자 컴퓨터)

ajax+django(csrf) 통신하기 ajax는 http의 post or get 을 이용한 통신을 합니다. 우선 test할 html 파일은 django 서버에 탬플릿 폴더에 있어야 합니다. 브라우저 들이 정책상 ajax의 데이터를 서버와 같은 곳에서 호출해야 하기 때문 예를 들면 post 로 데이터를 보낼 서버의 IP 주소가 와 포트가 10.23.10.232:8888 이라고 합니다. 그때 ajax에서 url:'/polls/searchData/' 이러한 속성을 설정하는데 여기에서 url 은 http://10.23.10.232:8888/polls/searchData 을 의미하지만 다른 웹서버(예를들면 10.23.10.230:8888)에 똑같은 내용의 웹서버가 있어 http://10.23.10.230:88..

에니메이션 자바스크립트와 CSS를 이용해서 HTML엘리먼트에 동적인 효과를 줄 수 있다.jQuery의 효과 메소드를 호출하는 것만으로 간단히 효과를 줄 수 있다. target » Run Hello! 에니메이션은 직접 예제코드를 실행 하시는편이 가장 이해하기 쉽고 좋을것 같습니다.

폼 이벤트 간단하게 폼이벤트에 대해서 다뤄 보겠습니다. 이벤트에 대한 좀더 상세한 내용은 jQuery 폼 API 문서 : http://api.jquery.com/category/forms/ 에 더 많은 API 와 이벤트 들이 소개 되어 있습니다. (.focus(), .blur(), .change(), .select()) .focus input 태그에 포커스가 되었을때 발생 합니다..blur 포커스가 해제 될때 사용 됩니다 ..change input 태그 값이 변경 될때 사용 됩니다. - function(e) 함수에 e 라는 변수를 줬는데 이것은 현재 $("input") 와 같습니다. - $(e.target) 은 $(this) 와 같습니다. .select input 태그 안에 문자열이 선택 될때 발생 합니..

엘리먼트 제어 jQuery는 엘리먼트를 제어하는 일관되고 풍부한 기능들을 제공한다.http://api.jquery.com/category/manipulation/ 이제 부터 예제로 학습 하겠습니다. 자식으로 삽입 (.append(), .appendTo(), .html(), .prepend(), .prependTo(), .text()) I would like to say: 그리고 크롬 개발자 도구(F12) 로 보면 자식으로 해당 내용이 추가 되었습니다. 형제로 삽입 (.after(), .before(), .insertAfter(), .insertBefore()) I would like to say: 부모로 감싸기(.unwrap(), .wrap(), .wrapAll(), .wrapInner()) Span T..

이벤트란? 시스템에서 일어나는 사건을 의미javascript나 jQuery에게 이벤트란 브라우져에서 일어나는 사건을 의미한다. (클릭, 마우스 이동, 타이핑, 페이지 로딩등)이벤트가 발생했을 때 작동할 로직을 시스템에게 알려두면 이벤트가 발생했을 때 시스템이 그 로직을 호출한다. jQuery의 이벤트 크로스브라우징의 문제를 해결해줌(호환성 문제 해결)on으로 이벤트 핸들러를 설치하고,off 로 제거trigger로 이벤트 핸들러를 강제로 실행click, ready와 같이 다양한 이벤트 헬퍼(helper)를 제공함on를 이용하면 현재 존재 하지 않는 엘리먼트에 이벤트 핸들러를 설치할 수 있음 $(document).on('ready', 문서 준비가 완료 되면 function() 을 실행 합니다. $('#cli..

Chain이란? jQuery의 메소드들은 반환값으로 자기 자신을 반환해야 한다는 규칙을 가지고 있다.이를 이용하면 한번 선택한 대상에 대해서 연속적인 제어를 할 수 있다. jQuery chain의 장점 1.코드가 간결해진다.2.인간의 언어와 유사해서 사고의 자연스러운 과정과 일치함. 탐색(traversing) chain의 대상을 바꿔서 체인을 계속 연장시킬 수 있는 방법 너무 복잡한 chain은 코드의 가독성을 떨어 뜨릴 수 있다. list item 1 list item 2 list item 3 list item 1 list item 2 list item 3

JQuery 선택자 Jquery는 강력하게 엘리먼트를 선택할수 있는 수단들을 많이 제공 합니다. 생활코딩 사이트에서 선택자 예제중 가장 좋은 예제 같네요 기본 HTML CSS javascript jQuery PHP MYSQL HTML CSS javascript jQuery PHP MYSQL - id 선택자 - class 선택자 - 엘리먼트 선택자 - 다중 선택자 filter HTML CSS javascript PHP MYSQL HTML CSS javascript PHP MYSQL - 인자와 인덱스가 동일한 엘리먼트를 찾아내는 선택자 - 인자 보다 인덱스가 큰 엘리먼트를 찾아내는 선택자 - 인자 보다 인덱스가 작은 엘리먼트를 찾아내는 선택자 - 첫번째, 세번째... 홀 수의 인덱스 값을 가진 엘리먼트에 대..

javascript vs JQuery 해당 강의를 보기 전에 javascript를 알고 보는것이 좋습니다. 먼저 javascript 예제 코드 입니다. HTML CSS javascript jQuery PHP mysql 위 샘플 코드가 많으니 분석을 해보도록 하겠습니다. HTML CSS javascript jQuery PHP mysql 이코드만 보면 css 는 select 라는 이름의 클래스를 background-color:red;color:white; 으로 만들어 주는 군요. function addEvent(target, eventType,eventHandler, useCapture) { if (target.addEventListener) { // W3C DOM target.addEventListener..

jQuery란? 엘리먼트를 선택하는 강력한 방법과 선택된 엘리먼트들을 효율적으로 제어할 수 있는 다양한 수단을 제공하는 자바스크립트 라이브러리입니다. - 엘리먼트는 HTML 의 요소 들입니다. 예를 들면 java script 에서 사용 했던 document.getElementsByTagName, document.getElementsByClassName,document.getElementById 을 통해 선택 했던 기능과 똑같지만 더강력하게 찾을수 있는 방법과 이를 javascript 보다 더욱 효율적으로 제어할수 있는 방법을 제공하는 라이브러리 입니다. JQuery를 사용하기 위해서는 JQuery 라이브러를 가지고 와야합니다. 부분이 구글 JQuery 라이브러리를 가지고 부분으로써 JQuery를 사용하기..