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. jQuery는 빠르고 작으며 기능이 풍부한 자바스크립트 라이브러리입니다.HTML 문서 스트리밍, 조작, 이벤트 처리, 애니메이션, Ajax 등 일을 훨씬 간단하게 할 수 있고, 사용하기 쉬운 API는 여러 브라우저에서 사용할 수 있다.
jQuery 대상과 DOM 원본 대상은 어떤 차이가 있습니까?어떻게 전환합니까?
get
방법으로 지정한 index의 DOM 대상을 얻을 수 있습니다.$('div')[2];
$('div').eq(2);
$('div')get();
$()
을 사용하여 DOM 대상을 감싸면 하나의 jQuery 대상을 얻을 수 있습니다 jQuery에서 이벤트를 어떻게 바인딩합니까?
bind
, unbind
, delegate
, live
, on
, off
은 모두 어떤 작용을 합니까?어떤 걸 추천해드릴까요?on
귀속 이벤트를 사용하여 이벤트 에이전트를 사용합니까?on
방법으로 이벤트 바인딩, off
방법으로 이벤트 제거bind
요소에 이벤트 처리 프로그램 unbind
요소에서 이전 추가 이벤트 처리 프로그램 제거 delegate
은 모든 일치 선택기(selector 매개 변수)의 원소에 하나 이상의 이벤트 처리 함수를 귀속시킨다. 지정된 루트 원소의 서브집합을 바탕으로 일치하는 원소는 현재 일치하는 원소를 포함하고 앞으로 일치할 수 있는 원소 live
에는 현재 선택기의 모든 요소와 일치하는 이벤트 프로세서가 추가되어 현재와 미래 on
선택한 요소에 하나 이상의 이벤트 처리 함수 귀속 off
이벤트 처리 함수 제거 on
방법 바인딩 이벤트, off
방법 오프로드 이벤트 on
바인딩 이벤트 사용 이벤트 에이전트 쓰기 $('.box ul').on('click', 'li', function(){
// Do something
})
var $h1 = $('h1');
$h1.css('display','none')
// CSS
.class {
display: none;
}
// JS
var $h1 = $('h1');
$h1.addClass('class');
$h1.removeClass('class');
var $h1 = $('h1');
$h1.hide(); //
$h1.show(); //
$h1.toggle(); // /
duration
애니메이션 지속 시간, 단위 밀리초, 기본 400ms;easing
은 어떤 완동 함수를 과도적으로 사용하는지 jQuery 자체가 linear
과 swing
을 제공한다.complete
이 애니메이션이 완성될 때 실행하는 함수;opacity
불투명도, 1은 불투명, 0은 완전 투명;.show([duration ] [, easing ] [, complete ])
.hide([duration ] [, easing ] [, complete ])
.toggle([duration ] [,easing ] [,complete ])
.fadeIn( [duration ] [, easing ] [, complete ] )
.fadeOut( [duration ] [, easing ] [, complete ] )
.fadeTo( duration, opacity [, easing ] [, complete ] )
.fadeToggle( [duration ] [, easing ] [, complete ] )
.slideDown( [duration ] [, easing ] [, complete ] )
.slideUp( [duration ] [, easing ] [, complete ] )
.slideToggle( [duration ] [, easing ] [, complete ] )
.animate( properties [, duration ] [, easing ] [, complete ] )
properties
은 CSS 속성과 값의 개체로서 애니메이션은 이 개체 그룹에 따라 이동합니다.예: $('#clickme').click(function() {
$('#book').animate({
opacity: 0.25,
left: '+=50',
height: 'toggle'
}, 5000, function() {
// Animation complete.
});
});
.clearQueue( [queueName ] )
.finish( [queue ] )
.stop( [clearQueue ] [, jumpToEnd ] )
clearQueue(default: false)
jumpToEnd(default: false)
요소 내부의 HTML 내용을 설정하고 가져오는 방법은 무엇입니까?어떻게 요소 내부 텍스트를 설정하고 가져옵니까?
.html([string])
innerHTML
을 매개 변수 값으로 수정합니다 $('div').html();
$('div').html(`123`);
innerHTML
innerHTML
을 매개 변수 값으로 수정합니다 $('div').text();
$('div').text(`123`);
어떻게 폼 사용자가 입력하거나 선택한 내용을 설정하고 얻습니까?어떻게 원소 속성을 설정하고 얻습니까?
.text([string])
이것은 input의value를 읽기 및 쓰기 두 가지 방법으로 처리하는데 사용되며 방법이 매개 변수가 없을 때 input의value값을 되돌려줍니다. 매개 변수를 전달할 때 방법은 input의value값을 매개 변수값인 $('input').val()
$('input').val()
innerText
innerText
/innerText
/.val([value])
.attr(attributeName)
제목
클릭하여 보기
제목
클릭하여 보기
제목
클릭하여 보기
제목
클릭하여 보기
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.