유혁스쿨

문서가 준비되면 ready() 함수의 매개변수에 해당하는 콜백함수를 실행하라는 의미로써, jQuery 이벤트 중 하나이다. jQuery의 또 다른 표현방식은 다음과 같다 자바스크립트에서 다음코드와 비슷한 기능을 수행한다. 2022.01.18 - [JavaScript/DOM & Event] - window객체와 이벤트 (BOM/DOM) window.onload window객체와 이벤트 (BOM/DOM) window.onload 브라우저 객체 모델 BOM, Browser Object Model은 웹 브라우저와 관련된 객체의 집합을 의미한다. 대표적인 브라우저 객체 모델로는 Window, Location, Navigator, history, screen, document 객체가 있다. window.. u-it..

선택자 $()의 형태는 $('요소') 혹은 $('속성') 과 같이 사용해왔다. ( 요소[속성=값] 혹은 요소:속성 ) 매개변수를 하나만 넣었을 경우 해당하는 요소나 클래스를 모두 찾아간다. https://u-it.tistory.com/entry/%EC%86%8D%EC%84%B1%EC%84%A0%ED%83%9D%EC%9E%90-%ED%95%84%ED%84%B0%EC%84%A0%ED%83%9D%EC%9E%90?category=1019283 속성선택자 , (입력양식)필터 선택자 / 요소[속성=값] , 요소:속성 [속성 선택자] 속성 선택자 문법은 기본적으로 요소[속성=값] 의 형태이다. 속성 선택자는 요소에 명시적으로 지정하는 name, id, class 등의 속성 값과 일치한 요소를 찾는 선택자이다. 여기서..

$(document).ready(function (){ $('h1').on('mouseenter',function(){ $(this).addClass('reverse'); }); $('h1').on('mouseleave',function(){ $(this).removeClass('reverse'); }); }); 태그 요소에 마우스를 올려놓았을때 'reverse' 클래스 속성을 추가하고, 다시 마우스를 요소로부터 떨어트리면 추가된 'reverse'클래스 속성을 제거한다. 이와 같은 문법을 한번에 객체형태로 만들 수 있다. $(document).ready(function (){ $('h1').on({ mouseenter: function(){ $(this).addClass('reverse'); } , mo..

https://u-it.tistory.com/entry/each-%ED%95%A8%EC%88%98-%EC%82%AC%EC%9A%A9%EB%AC%B8%EB%B2%95 each() 함수 '요소' 관리 사용 문법 선택자를 변수에 담은 후 변수로 접근하여 사용 가능 선택자를 변수에 담은 후 변수를 매개변수로 담아 접근하여 사용 가능 Object 배열에서는 다음과같이 변수로 사용이 불가능해진다. u-it.tistory.com 지난 시간에 each 함수를 통해 요소를 반복하여 관리하는 문법을 구현했었다. $(document).ready(function (){ $('h1').each(function(index,item){ $(item).addClass('item'+index); }); }); 선택자를 지정하고 eac..

1. css() 메서드의 매개변수에 {backgroundColor : 'black , color : 'white'} 와 같은 형태로 속성을 지정할 수 있다. 2. css() 메서드의 매개변수에 'background','black' 와 같은 형태로 속성을 지정할 수 있다. 1번의 형태 경우에는 $('h1').css( { backgroundColor : 'white' , color : 'red' } ) stylesheet방식과 유사한 형태로 {중괄호}안에 변경할 속성을 나열하여 한번에 지정할 수 있다. 2번의 형태 경우에는 $('h1').css('background', 'white').css('color','red') 와 같이 지정할 스타일이 복수개일 경우 메서드를 각각 두번 호출하여 설정해야한다. 주의할 ..

[filter] Header-0 Header-1 Header-2 위와같이 fiter를 사용할 때 적용은 되지만 정확한 설정에 맞게 적용이 되지 않는다. 여기서 개발자가 의도하는 정확한 설정은 h1, h1의 홀수요소, h1의 짝수요소 각각의 스타일 속성을 다르게 지정한다. 하지만 위의 코드상의 순서대로 적용된다면 h1요소의 홀수에 filter를 걸고 h1요소의 홀수중 짝수에 filter가 걸리기 때문이다. filter를 한번 사용할 때 마다 h1 이라는 문서 객체의 범위가 점점 좁아진다. h1 -> h1:even(홀수) -> h1:even:odd(홀수중 짝수) [end] 올바른 범위는 h1 -> h1: even(짝수) -> h1:odd(홀수) 가 되어야 하며 end() 메서드를 사용한다. end() 메서드..

선택자를 변수에 담은 후 변수로 접근하여 사용 가능 선택자를 변수에 담은 후 변수를 매개변수로 담아 접근하여 사용 가능 Object 배열에서는 다음과같이 변수로 사용이 불가능해진다.

[속성 선택자] 속성 선택자 문법은 기본적으로 요소[속성=값] 의 형태이다. 속성 선택자는 요소에 명시적으로 지정하는 name, id, class 등의 속성 값과 일치한 요소를 찾는 선택자이다. 여기서 말하는 요소란 태그의 이름을 말한다. 이렇게 하면 input type이 text인 입력 양식의 value 속성이 'Hi jQuery..!' 값이 정의되고 text input박스에 Hi jQuery..! 라는 문자열 값이 입력된 상태로 페이지가 출력된다. [필터 선택자] 선택자 중에 : 기호를 포함하는 선택자이다. 필터선택자는 요소에 명시적으로 지정된 특정 속성을 찾아간다. input 요소에는 type속성 혹은 checked속성을, option 요소에는 selected속성을 찾아갈 수 있다. input 입력..

html onclick속성 자바스크립트 숨은 DIV보이기 DIV 숨기기 function onDisplay() { $('#noneDiv').show(); } function offDisplay() { $('#noneDiv').hide(); } JQuery 클릭이벤트 숨은 DIV보이기 DIV 숨기기

$()로 아이디에접근해서 클릭했을때 이벤트발생시킨후 .val()로 해당태그의 value값을 받아와 let keyword변수에담는다. 그리고 location.href=""에 파라미터를 실어 요청을 달린다 여기서 신기한건... 아이디에접근할때 $('#아이디명') 으로 접근해야하는데 $(아이디명) 이렇게 실수를 했는데 접근이 됬다는거... 뭔가 오류가있었던건지, 아니면 문법이 바뀐건지,,,, 잘모르겠다.