🍁Traversing 기본 코드 Axis 할아버지 큰아버지 사촌 아버지 큰형 작은형 나 자식 손자 자식 자식 동생 막내동생 작은아버지 사촌 [JavaScript] Axis: 축을 기준으로 검색 🍁Axis 태그를 찾는 방법으로 식별자를 이용해서 찾는 방법이 있고, 축을 기준으로 찾는 axis 기능이 있다. 기본 코드 Axis 할아버지 큰아버지 사촌 아버지 큰형 작은형 나 자식 손자 자식 자식 동 isaac-christian.tistory.com Axis에 대해서는 위 글을 참고한다. 자식에 접근 모든 자식에 접근 children $('#me').children().addClass('check'); 특정 자식에 접근 first last eq $('#me').children().first().addClass(..
🍁CSS 적용 CSS 읽기 쓰기 읽기: CSS(속성) 쓰기: CSS(속성, 값) CSS 읽기 //alert(getComputedStyle(document.getElementById('box')).getPropertyValue('color')); alert($('#box').css('color')); jQuery에는 내부적으로 이 작업이 되어 있다는 것을 알 수 있다. CSS 쓰기 (메서드 체인) //$('#box').css('color', 'blue'); $('#box').css('color', 'blue').css('background-color', 'gold').css('font-size', '3rem'); jQuery는 연쇄적으로 작업할 수 있다는 점에서 편리하다. css(속성명, 값)이 반복하여 ..
🍁전용 함수와 범용 함수 전용 이벤트 함수 객체.이벤트함수(콜백함수) $('#btn1').click(function() { alert(); }); 위 코드는 클릭 이벤트만을 처리하는 함수이다. 이렇게 하나의 이벤트만을 처리하는 함수를 전용 이벤트 함수라고 한다. 범용 이벤트 함수 객체.on(이벤트명, 콜백함수) $('#btn2').on('click', function() { alert(); }) on은 범용 함수로, 이벤트명을 입력해야 한다. 이벤트명에 따라서 다양한 이벤트를 처리하는 함수를 범용 이벤트 함수라고 한다. 반대로 객체의 이벤트를 해제할 때에는 off 함수를 사용한다. 🍁Effect Function 1. hide(time), show(time), toggle(time) 2. fadeOut(t..
🍁jQuery() 함수 jQuery() 함수는 CSS 선택자 또는 다른 표현을 사용해서 태그를 검색한다. 기본 코드 jQuery() 함수 상자1 상자2 상자3 상자4 상자5 Array.from() //forEach > new Array()에서 동작 //list.forEach(box => box.style.color = 'yellow'); //HTMLCollection (유사 배열) Array.from(list).forEach(box => box.style.color = 'tomato'); 자바스크립트는 구조상 진짜 배열이 없다고 했다. 하지만 new Array()로 만들어진 것을 진짜 배열로 취급한다. 위에서 선언한 list는 배열이 아닌 HTMLCollection(유사 배열)이며, 유사 배열은 forE..
🍁 jQuery jQuery란? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript. jQuery는 경량화된 Java..
