남다른 논리

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 이벤트

[jQuery Event] 제이쿼리 on /off에 대한 API 입니다.http://api.jquery.com/on/ http://api.jquery.com/category/events/event-handler-attachment/ 에 들어있는 내용중 on /off 연습입니다. [html] Binding and Unbinding Events Example jQuery 마우스 오버 Type in this text field Last character typed: 스크립트 적용뒤, 처음에는 마우스 오버시, 배경이 빨간색으로 되며, 클릭한 다음에는다음과 같이 나옵니다. 스크립트 마지막의 다음 부분은 내용 입력시, 페이지 표기되는 스크립트입니다.$("textEntry").on("keypress", functio..

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 강좌를 시작하며..

좀 나중에 적게 되었지만, 제이쿼리에 강좌에 대해 적어봅니다. 이 강좌는 링크드인의 러닝강좌 중 (jQuery Essential Training) 을 공부하며 정리한 것입니다.강좌는 영어로 되어 있지만, 내용중 이해가 안되는 분들은 질문하시거나, 참조한 강좌를 보시면 됩니다. 이 강좌로 제이쿼리를 마스터 할수 없지만, 좋은 시작점이 될거라 생각됩니다. 공부하다보니, 제이쿼리가 웹에서 많이 중요함을 느낍니다. 자바스크립트 라이브러리지만, 많은 기능을 포함 하고 있어서 이 강좌 이후에도 깊이 있는 연구할 필요가 있다고 생각됩니다. 좋은 프로그램 언어이자, 필수 라고 생각됩니다. 제이쿼리를 시작하기에 앞서 HTML, CSS, JAVASCRIPT에 대한 이해가 필요합니다. 혹이 이 블로그로 공부하신다면, 충분치..

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 연습문제3

아래 스트립트 내용을 쓰는 것입니다. 문제: html내용의 상품 리스트 중 버튼을 클릭한 상품만 나오도록 하세요. [html]아래중 div내의 form부분은 버튼관련 html을 추가해야 하는 것입니다. ( ) Products H+ Sport is dedicated to creating eco-friendly, high-quality, nutrient-rich, nutritional products that enhance active lifestyles. We guarantee it. Take a look at some of our products. Vitamin A Vitamin-B Complex Blueberry Mineral Water Vitamin C Chocolate Protein Bar Calc..

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 DATA

제이쿼리 DATA 추가, 삭제, 확인 하는 예제입니다. html 문장 1 문장 2 문장 3 문장 4 문장 5 Store data Remove data Show data결과화면 : 데이터를 저장하고, show data 버튼을 누른 화면입니다.

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리와 CSS

제이쿼리와 CSS html은 아래와 같고 문장 1 문장 2 문장 3 문장 4 문장 sentence 5 Set Property Set Properties Add Class Remove Class Toggle Class 각 스크립트의 결과물 입니다

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 attr() 이해하기

jQuery의 API 인 attr (attribute)를 사용하는 예제 입니다. [html]

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 콘텐츠 변경방법

제이쿼리를 이용한 콘텐츠 변경방법입니다. 먼저Html은 [Html] 문장 1 문장 2 문장 3 문장 4 문장 5 제이쿼리 스크립트 입니다. 오늘 배울 내용은 1. 콘텐츠 속성변경 결과는 같지만소스 코드가 다릅니다. 왼쪽이 첫번째로, 각 p마다 코드가 적용된 것입니다.오른쪽은 div 전체에 적용 되었습니다. 2. Empty("#example").empty(); 3. Remove$("#example p.a, #example p.b").remove();p의 클래스가 a 와 b인 1줄, 3줄이 지워집니다. 4. detatch : remove와 보이는것은 같지만, 임시적으로 안보이게 하는 것으로서, 다른 이벤트 핸들러를 이용해 보이게 할 수 있습니다.$("#example p.a, #example p.b").det..

프로그래밍/웹프로그래밍

[jQuery] 제이쿼리 콘텐츠 삽입하기

콘텐츠 내용을 추가하거나, 삽입하는 방법을 설명하고자 합니다. Using append는 p태그에 문장을 추가하는 것이고Using prepend는 p태그 앞에 문장을 삽입하는 것입니다. 이번 내용은 before 와 after를 이용해서 콘텐츠를 삽입하는 것입니다. [이번에 연습할 코드는 다음과같습니다] 먼저 html을 보면 문장 1 문장 2 문장 3 문장 4 문장 5 ( 콘텐츠 변경 적용전 이미지 입니다) 여기에 다음을 제이쿼리를 이용해 콘텐츠를 변경해 봅니다. 2. 테스트 : 마지막 p를 첫 p뒤에 붙여 넣는다.$("#example p:last").appendTo("#example p:first") //마지막 p를 첫 p 뒤에 추가 3. 테스트 : 마지막 p를 첫 p앞에 붙여 넣는다.$("#example..