All
[스터디] CSS 시크릿_예제 풀어보기
css _시크릿_예제 풀어보기 2017.08.07 반투명 경계선https://jsfiddle.net/Kimara/d6o3bymL/ 다중 경계선 https://jsfiddle.net/Kimara/0z8egxa6/https://jsfiddle.net/Kimara/0z8egxa6/2/ 안쪽 둥근 모서리https://jsfiddle.net/Kimara/0xxLv57b/https://jsfiddle.net/Kimara/0xxLv57b/1/ 줄무늬 배경https://jsfiddle.net/Kimara/o0s1m83z/https://jsfiddle.net/Kimara/o0s1m83z/3/https://jsfiddle.net/Kimara/o0s1m83z/4/https://jsfiddle.net/Kimara/o0s1m8..
[제이쿼리] .attr() .addClass() .removeClass()
.attr() 1) .attr(attributeName) : 선택된 요소 집합에서 첫번째 요소의 attributeName에 해당하는 속성값을 반환한다. .attr() 함수는 선택자에 의해 선택된 요소들 중에서 제일 처음 요소의 속성값을 가지고 오는 함수입니다. 만일 모든 요소들의 속성값을 개별적으로 알고 싶다면, jQuery의 .each()함수나 .map()함수를 사용해야 합니다. .attr() 함수는 속성값을 가져오지 못하면 undefineded를 반환합니다. https://jsfiddle.net/Kimara/bqfw6u89/1/ 2) .attr( attributeName(속성명), value(속성값)) : 선택자에 의해 선택된 요소에 하나 이상의 속성을 부여할 수 있습니다. https://jsfidd..
[제이쿼리] .prepend() .prependTo() .append() .appendTo() .InsertAfter() .after() .InsertBefore() .before()
.prepend() / .prependTo() / .append() / .appendTo() 일치하는 요소 집합의 각 요소의 시작 부분에 매개 변수에 의해 지정된 내용을 삽입합니다. .prepend() 함수는 jQuery집합체 안에 있는 각 요소의 첫번째 자식 요소에 값을 삽입합니다..prepend()와 .pependTo() 함수의 기능은 동일합니다. 가장 큰 차이점은 문법의 차이입니다. .prepend()는, 함수 앞에 선택자 표현을 하고 선택된 요소에 함수의 인자인 내용이 삽입됩니다. 반면, .prependTo()는, 함수의 인자로 선택자가 전달되어 요소를 선택한 후 함수 앞이 내용이 삽입됩니다. .append() 함수는 jQuery 집합의 각 요소별로 마지막 자식 요소를 추가해주는 함수입니다..ap..
[제이쿼리] .prev() / .next() / .siblings()
.prev()DOM 트리를 기준으로 하여 바로 이전 요소를 새로운 jQuery 객체로 만들어 반환해 줍니다. 이 함수에는 $()함수에 사용할 수 있는 모든 선택자 표현이 올 수 있습니다. 만일 그 선택자가 주어졌고 그 선택자에 의해 선택될 수 있는 요소들이 있다면 결과에 포함되어 jQuery 객체가 반환되고 그렇지 않다면 제외됩니다. .next()이 함수에는 $()함수에 사용할 수 있는 모든 선택자 표현이 올 수 있습니다. 만일 그 선택자가 주어졌고 그 선택자에 의해 선택될 수 있는 바로 다음 요소들이 있다면 jQuery 객체가 반환되고 그렇지 않다면 제외됩니다. .siblings()DOM 트리 상의 형제 요소들을 찾아 새로운 jQuery 객체를 만들어 줍니다.이 함수에는 $() 함수에 사용할 수 있는 ..
[제이쿼리] .children() / .parent()
.children() .children()함수는 DOM 트리에서 자식 요소들을 즉시 찾을 수 있도록 해주고 일치되는 요소들을 새로운 jQuery 객체로 만들어 줍니다. .find()와 .children()함수는 아주 유사하지만 DOM 트리에서 레벨 1의 위치-첫번째 깊이-만 검색을 하는 부분에서 차이점이 있습니다. .find()함수는 선택요소의 내부 요소들을 모두 검색하고 .children()함수는 바로 아래 수준의 요소만 자식요소로 인정합니다. .children()함수는 text나 주석(comment)들은 반환하지 않습니다. 만약 텍스트 노드나 주석 요소도 반환하고 싶으면 .contains()함수를 사용해야 합니다. .children([selector])selector 일치하는 요소들 중에서 추가적으로..
[제이쿼리] .each() / .filter() / .find() _170816
.each() DOM의 기본 Loop개념을 간결하고 최소한의 오류 발생을 위해 만들어 졌습니다. DOM 요소들 즉, jQuery 객체들을 위해 반복 로직을 처리하기 위해 만들어졌습니다. 0을 인덱스의 초기값으로 하여 콜백 함수가 실행됩니다. 더 눈여겨 봐야 할 것은, this키워드를 사용하면 현재 콜백되고 있는 DOM 요소에 어떤 작업을 할 수 있게 됩니다.=> .each() 함수는 jQuery 객체의 수만큼 for 문 같이 반복을 해주는 함수이다. .each( function(index, element))function(index, element) 선택된 요소에 실행될 함수 https://jsfiddle.net/Kimara/8rjbnt4h/3/ .filter() jQuery 객체를 이용해서 표현된 DO..
[제이쿼리] each,find,filter _20170814
each,find,filter https://jsfiddle.net/Kimara/Lc87h8t5/4/ .each()함수는 jQuery 객체의 수만큼 for문 같이 반복을 해주는 함수이다.(.each() 함수는 DOM의 기본 Loop 개념을 간결하고 최소한의 오류 발생을 위해 만들어 졌습니다. DOM 요소들 즉, jQuery 객체들을 위해 반복 로직을 처리하기 위해 만들어졌습니다. 0 을 인덱스의 초기값으로 하여 콜백 함수가 실행됩니다. 더 눈여겨 봐야 할 것은, this키워드를 사용하면 현재 콜백되고 있는 DOM 요소에 어떤 작업을 할 수 있게 됩니다.)
[제이쿼리] 선택자 예제20170809
제이쿼리_선택자 예제https://jsfiddle.net/Kimara/xq6tm8q5/2/ 제이쿼리 _응용_차 색 바꾸기https://jsfiddle.net/Kimara/43gcryd4/3/ 제이쿼리 _20170811 _eqhttps://jsfiddle.net/Kimara/fbrwfxp7/
[제이쿼리] 선택자
제이쿼리 :: 선택자 1. 기본 선택자 $('hi').css('color','red'); ----- -------------------선택자 메서드 2. 전체선택자 3. 태그선택자 4. 아이디선택자 5. 클래스선택자 6. 자손선택자와 후손선택자 7. 속성선택자- 기본 선택자 뒤에 붙여 사용- 입력 양식과 관련된 태그를 선택할 때 많이 사용 선택자 형태 설명 요소[속성=값] 속성과 값이 같은 문서 객체를 선택 요소[속성|=값] 속성 안의 값이 특정 값과 같은 문서 객체를 선택 요소[속성~=값] 속성 안의 값이 특정 값을 단어로 시작하는 문서 객체를 선택 요소[속성^=값] 속성 안의 값이 특정 값으로 시작하는 문서 객체를 선택 요소[속성$=값] 속성 안의 값이 특정 값으로 끝나는 문서 객체를 선택 요소[속성..