본문 바로가기

전체 글767

jQuery API 정복 - select 박스에서 선택된 것 찾기 : selected :selected 는 선택박스에서 선택된 요소를 반환해 줍니다. 원문 링크 http://api.jquery.com/selected-selector/ selected selector jQuery(':selected') :selected 선택자는 태그 전용입니다. 체크박스나 라디오 버튼은 :checked 선택자를 사용하셔야 합니다. 예 제 소스닫기 선택된 것의 텍스트를 표시해 줍니다. 다중 선택이 가능하니 컨트롤 키를 누른 상태에서 선택해 보세요. Flowers Shrubs Trees Bushes Grass Dirt 미리보기 select 의 change 함수가 나왔네요. 뭔가가 변화된다면 호출되는 함수입니다. 기본 JavaScript의 이벤트함수인 onchange의 역할을 하네요. 그리고 그 안에 each .. 2011. 2. 22.
블로그 글을 더 가치 있게 읽는 방법 현대인들의 하루 생활은 정보 홍수속에서 허우적 거린다라고 해도 오버스럽지 않습니다. 너무나 많은 정보들이 새로 생겨나고 소멸해 갑니다. 개인은 그것들을 재생산 또는 확대하기도 하여 전달하는 세상이 되었습니다. 과거에는 정보는 사람의 입으로만 전달되어 그 한계가 뚜렸했습니다. 시간이 조금 흐르면 정보의 근원지가 어딘지 찾을 수 없게 되어서 그 정보의 신뢰성이 희석되고 그저 그런 소문에 불과하게 되어 버리게 되는 경우가 많았습니다. 그럼에도 불구하고 "발 없는 말이 천리간다"는 속담이 있었습니다. 그 당시에도 정보의 전달력은 상당했다는 얘기겠죠. 요즘에는 넘쳐나는 정보를 잘 걸러내야 하는 것이 현대인의 중요한 일과가 되었습니다. 자신에게 도움이 되는 정보만 소비하기에도 바쁜 날들의 연속이니까요. 특히나 긴 .. 2011. 2. 21.
jQuery API 정복 - reset 버튼 찾기 : reset :reset 은 input 의 type=reset 인 요소를 찾습니다. 원문 링크 http://api.jquery.com/reset-selector/ reset selector jQuery(':reset') 예 제 소스닫기 reset 버튼을 찾습니다. Option Button 미리보기 뭐 딱히 추가할게 없어요 ^^;;;; 그럼 즐프하세요. ※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다. 2011. 2. 21.
jQuery API 정복 - radio 버튼 찾기 : radio :radio 는 input 의 type 이 radio 인 요소를 찾아줍니다. 원문 링크 http://api.jquery.com/radio-selector/ radio selector jQuery(':radio') 예 제 소스닫기 type 이 radio 인 버튼을 찾아 빨간색을 두릅니다. Option Button 미리보기 흔히 쓰는 성별을 가져오기 위해서 사용할려면 $('input[name=gender]:radio') 이런식으로 사용하시면 된다고 하네요. 남/녀 찾기 참 쉽죠잉~ input 에 관련된 선택자들은 참 사용하기 쉬운 것 같습니다. 그럼 즐프하세요. ※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다. 2011. 2. 21.
jQuery API 정복 - type=password 인 것 찾기 : password :password 는 input 의 type이 password 인 요소를 찾습니다. 원문 링크 http://api.jquery.com/password-selector/ password selector jQuery(':password') 예 제 소스닫기 input 중에 password 타입을 찾아서 빨간색을 두릅니다. Option Button 미리보기 평이합니다. 패스~ 그럼 즐프하세요. ※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다. 2011. 2. 18.
jQuery API 정복 - 다른 요소를 포함한 요소 찾기 : parent :parent 는 텍스트 노드를 포함한 요소를 가지고 있는 상위 요소를 찾습니다. 원문 링크 http://api.jquery.com/parent-selector/ parent selector jQuery(':parent') 음, 느낌으로만 보자면 parent 선택자가 마치 부모요소를 찾는 선택자인 것처럼 보입니다만, jQuery.com의 설명은 조금 다릅니다. 부모를 선택하는 것은 맥락상 맞지만 조금 관점이 다른 것 같네요. 부연 설명을 보시죠. 이 선택자는 :empty 선택자와 반대 선택자입니다. (:child 가 아닌것에 주목하세요.) 한가지 중요한 사실은 :parent (또는 :empty) 선택자는 text 노드도 자식 요소로 여긴다는 점입니다. W3C 에 따르면 태그는 적어도 하나의 자식 노드를 .. 2011. 2. 18.
애플 30% 구글 10%, 구글이 애플의 뒤통수를 치다. 얼마전 아이패드용 '더 데일리' 구독 서비스가 진행되었다. 스티브 잡스는 미디어 유통의 대가로 30%의 대가를 원했다. 많은 논란과 함께 미디어 업계에서 우려의 목소리가 흘러나왔다. 애플이 독점적 지위를 이용하여 폭리를 취하려 한다는 얘기도 나왔다. 오늘 구글은 "원패스"라고 이름 지어진 미디어 구독 서비스를 발표하고, 에릭 슈미츠 구글 CEO는 자신들은 10%의 수수료만 요구하겠다고 얘기했다. 여기에 많은 미디어 업계들은 반색하며 반기는 분위기다. 애플의 그것보다 아주 합리적으로 느껴지는 모양이다. 내용을 좀 더 자세히 들여다 보자. 스티브 잡스가 밝힌 구독 서비스의 애플의 방식은 2가지이다. 소비자가 애플의 결제 서비스를 이용하여 결제를 하면 그 금액의 30%를 수수료로 가져 가는 방식과 콘텐츠업체 .. 2011. 2. 17.
jQuery API 정복 - 유일한 자식 요소 찾기 : only-child :only-child 자기가 유일한 자식인 요소를 찾아 줍니다. 원문 링크 http://api.jquery.com/only-child-selector/ only-child selector jQuery(':only-child') 예 제 소스닫기 형제가 없는 버튼을 찾아서 색을 바꿔줍니다. Sibling! Sibling! Sibling! None Sibling! Sibling! Sibling! Sibling! 미리보기 딱 보시면 아시겠죠? 외아들 또는 외동딸 보면 티 나잖아요. 하하;;; 그럼 즐프하세요. ※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다. 2011. 2. 17.
인간 vs 컴퓨터, 퀴즈쇼의 승자는? IBM 창립자의 이름을 따서 만든 슈퍼컴퓨터 "WATSON"이 인간과의 퀴즈 대결에서 승리했네요. 미국의 유명한 퀴즈쇼인 제퍼디(Jeopardy)에서 3일동안 인간과 경쟁한 이 컴퓨터는 총 상금 $77,147 를 벌어 드리며, 2명의 인간 경쟁자를 압도했다고 합니다. 과거 인간 체스왕과 슈퍼컴퓨터의 대결이 심심찮게 보도 되고는 했었는데, 이제는 퀴즈 대결이네요. 퀴즈와 체스는 완전히 다른 상황입니다. 인간과 동일한 조건에서 경쟁한다는 것도 대단한 것 같습니다. 왓슨은 인터넷에 연결되지 않은 채로 제퍼디 쇼의 가장 뛰어난 우승자였던 켄 제닝스(Ken Jennings)와 브래드 루터(Brad Rutter)와의 대결에서 승리했는데요. 문제를 듣고 풀었다는게 참 신기합니다. 왓슨은 냉장고 10개 정도의 크기로 .. 2011. 2. 17.
jQuery API 정복 - 홀수번째 요소 찾기 : odd :odd 선택자는 요소 집합에서 index 기준으로 색인이 홀수인 요소를 찾아줍니다. 원문 링크 http://api.jquery.com/odd-selector/ odd selector jQuery(':odd') 색인 기준으로 보면 홀수지만 눈으로 보이는 것은 짝수번째 인것처럼 보입니다. 그건 우리가 숫자를 배울때 1부터 배워서 그런건데요. 프로그램에서는 0이 시작점입니다. 그러니까 색인 기준으로 홀수번째 요소를 선택하고 싶으시면 이 선택자를 사용하시면 됩니다. 예 제 소스닫기 테이블에서 홀수번째 rows 를 선택해서 색을 입힙니다. (index 1, 3, 4 etc) 기억하세요 : 색인의 초기값은 0 입니다. Row with Index #0 Row with Index #1 Row with Index #2.. 2011. 2. 17.
jQuery API 정복 - n번째 자식요소 찾기 : nth-child :nth-child() 는 자식 요소 집합에서 선택한 색인에 위치한 자식을 찾는 요소입니다. 원문 링크 http://api.jquery.com/nth-child-selector/ nth-child selector jQuery(':nth-child(index/even/odd/equation)') index 1이 초기값이며 색인에 맞는 자식 요소를 찾는다. even, odd, equation 이라는 문자열도 사용할 수 있음. (예. :nth-child(event), :nth-child(4n)) :nth-child(n) 선택자는 CSS 사용법에서 파생된 jQuery의 문법이기 때문에, n 은 "1부터 시작"한다. 그러나 jQuery의 어떤 함수들은 JavaScript의 "0이 시작"인 인덱스 구조를 따른다. .. 2011. 2. 16.
jQuery API 정복 - ~이 아닌 요소 선택하기 : not :not() 선택자는 부정형 선택자입니다. 원문 링크 http://api.jquery.com/not-selector/ not selector jQuery(':not(selector)') 괄호 안의 조건이 아닌 요소들을 찾아냅니다. :not(div a) 나 :not(div, a)와 같은 표현으로 사용할 수 있습니다. .not() 함수를 이용하시는 것이 더 좋은 선택입니다. 복잡한 선택자 구성이나 선택자를 변수로 써야 할때 그리고 가독성을 높이기 위해서는 .not 메소드가 더 낫습니다. 예 제 소스닫기 체크가 되어 있지 않은 체크박스를 찾고 그 바로 다음 요소를 찾아서 바탕색을 노란색으로 바꿉니다. Mary lcm Peter 미리보기 not 선택자 사용법과 이전에 포스팅 했던 prev + next 선택자가 .. 2011. 2. 16.
Toy Fair 에 나온 10가지 멋진 장난감들 요즘 키덜트가 대세죠. 사실 아이폰과 같은 스마트폰은 어른들의 장난감으로 각광을 받고 있는 겁니다. 따로 배울 필요도 없고, 장난감을 가지고 논다고 핀잔 받지 않아도 되는 완벽한 장난감인게 분명합니다. 기사 전문에 보면 이제 장난감이 아이들의 전유물 만은 아니라고 합니다. 장난감 업계의 최신 트랜드는 KGOY 또는 "Kids getting older younger." 라고 하네요. 아마 아이(kids)의 나이 영역이 더 어려지고 똑똑해지고 있다는 의미가 아닐까 합니다. 경제 분야에서 나온 신규 용어입니다. 아이들이 새로운 소비자군단을 형성하고 있다는 뜻이라고 하네요. KGOY로 함 검색해 보세요. 나이압축("age-compression") 현상이라고 불리는 것 같네요. 나이압축이란 "인터넷 등 각종 미디.. 2011. 2. 15.
블로그 방문자 10,000명 돌파~ 하하;;; 10,000명 돌파 자체 축하모드 10,000번째인지 정확치는 않지만 검색어는 [jquery button] search.naver.com/search.naver?sm=tab_hty&where=nex.. 이거 였음. 자 다음 20,000번째를 향하여 고고 2011. 2. 15.
jQuery API 정복 - 다음 형제 요소 찾기 : next ~ siblings ('prev ~ siblings) 는 prev 에 해당하는 요소와 같은 위치의 형제요소를 찾아줍니다. 원문 링크 http://api.jquery.com/next-siblings-selector/ next siblings selector jQuery('prev ~ siblings') prev 유효한 선택자 siblings 선택된 요소와 형제 위치에 있는 요소들 sibling 의 단어의 뜻을 알면 아주 쉬운 문제입니다. sibling 은 형제,자매라는 뜻입니다. 바로 이해되시죠?. 이전에 말씀드린 'prev + next'와 'prev ~ siblings'를 잘 구분해서 사용하셔야 합니다. 예 제 소스닫기 우선 prev 라는 id를 가진 요소를 찾습니다. 그 요소 다음으로 오는 div를 찾습니다. 단, 찾을 .. 2011. 2. 15.
jQuery API 정복 - 다음 요소 선택하기 : prev + next ('prev + next') 선택자는 현재 선택된 요소를 기준으로 그 다음 선택자와 일치하는 첫번째 요소를 찾아줍니다. 원문 링크 http://api.jquery.com/next-adjacent-Selector/ next adjacent selector jQuery('prev + next') prev 유효한 선택자 next prev 에 선택된 요소 다음에 오는 next에 해당하는 선택자 한가지 중요한 고려해야 할 포인트가 있습니다. (prev + next) 와 (prev ~ sibilings) 인데요. 약간의 차이점이 있습니다. prev + next 는 prev 에 해당하는 선택자를 기준으로 next 에 해당하는 요소를 깊이에 상관없이 선택을 할 수 있습니다. 반면 prev + sibilings 는 pr.. 2011. 2. 14.
엔가젯에 올라온 갤럭시S 2 사진 및 리뷰영상 삼성이 이번에 선본인 갤럭시S 2 의 사진은 많이들 보셨을거라 생각됩니다. 엔가젯에 더 자세한 이미지들이 있어서 퍼왔습니다. 하드웨어가 엄청 업그레이드 됬다고들 하던데요. 안드로이드 진저브레드 OS를 기반하여 터치위즈 4.0을 탑재했다고 합니다. 제일 슬림한 폰이라고도 하더군요. 뭐 하드웨어 스펙이야 별 의미가 없어 보입니다. 실제로 이 제품이 출시되긴 전에 더 나은 하드웨어 스펙의 기기들이 속속 등장할테니까요. 제가 보기엔 발표회 때도 얘기가 나왔던 4가지 삼성 허브에 대한 얘기가 더 흥미롭게 보이던데요. 리더스, 음악, 게임, 소셜 허브가 기본 분류로 잡혀 있더군요. 그 4가지 허브를 삼성에서 키운다는 건지 단순히 아이콘 배열만 그렇게 한다는 건지는 아직 잘 모르겠습니다. 아래 사진 함 보시죠~. 외.. 2011. 2. 14.
블로그 스피어에서 온라인 게임을 느끼다. 일명 와우라고 불리는 블리자드의 MMORPG 게임이다. 한때 온라인게임을 재밌게 즐긴 때가 있었다. 갑자기 온라인게임 얘기를 한 것은 블로그의 생태계가 마치 온라인 게임의 그것과 비슷함을 느꼈기 때문이다. 여러가지 온라인 게임을 해봤지만 와우만큼 재밌게 즐긴 게임은 없었다. 아~ 샤이닝로어라는 내 생애 첫 MMORPG를 제외하면 말이다. 와우를 한참 즐기던 때, 아는 지인과 함께 길드를 만들었다. 그냥 이름에 길드명이 들어가면 멋있겠다라고 가볍게 생각하고 만든 길드는 의외로 많은 인원이 가입하게 되면서 큰 일처럼 되어 버렸던 기억이 있다. 처음에는 우연히 만난 유저들에게 길드 가입을 권하고, 같이 채팅하는 재미가 쏠쏠하게 느껴졌다. 게임에 접속하면 반갑게 인사해 주는 사람들 덕에 PC앞에 앉아 있는 시간.. 2011. 2. 14.
jQuery API 정복 - 한번에 여러 요소 선택하기 : Multiple Selector 여러가지의 다양한 요소를 한번에 선택하고 싶을 때 구성할 수 있는 방법입니다. 여러 선택자를 콤마로 연결하면 됩니다. 원문 링크 http://api.jquery.com/multiple-selector/ multiple selector jQuery('selector1, selector2, selectorN') selector1 유효한 선택자 selector2 또 다른 유효한 선택자 selectorN N개 만큼의 유효한 선택자 여러 선택자를 묶어서 사용하여 단 하나의 결과를 나타낼 수 있습니다. 이런 다중 표현 방식은 확실히 다른 요소들을 찾는 효과적인 방법이 됩니다. 이 결합(combinator) 선택자와 동일한 효과를 내는 .add() 함수가 있습니다. 예 제 소스닫기 div, span, p 이면서 my.. 2011. 2. 14.
jQuery API 정복 - 다중 속성 필터를 이용한 요소 선택 : Mutiple Attribute Selector 여러가지의 필터 요소를 사용해서 요소를 선택해야 하는 경우가 있습니다. 그럴때는 아래와 같이 하시면 됩니다. 원문 링크 http://api.jquery.com/multiple-attribute-selector/ attributeMultiple selector jQuery('[attributeFilter1][attributeFilter2][attributeFilterN]') attributeFilter1 추출 속성 attributeFilter2 선택 범위를 더 축소 시키는 또 다른 추출 속성attributeFilterN 필요한 만큼 N개의 추출 속성을 정의할 수 있음 동일한 형태의 요소들이 많을 경우 그 범위를 줄이기 위해 이 방법을 사용할 수 있습니다. [name="value"][name2="value2.. 2011. 2. 12.

티스토리툴바