Jquery는 자바스크립트로 작성된 라이브러리로, 일반적으로 사용되는 많은 메서드를 제공합니다. 이러한 메서드는 여러 브라우저와 호환될 수 있으며 해당 기간의 연구 노트를 살펴보겠습니다. 🎜> 1. $ 기호
1. 선택기
html 태그, ID, 클래스 등을 선택할 수 있습니다.
다음과 같습니다.
2. 태그에서 속성 가져오기
var sTitle = $("p>span").attr("Title") //태그의 속성 값 가져오기
$ ("p>a" ).text(sTitle);//값을 설정합니다. text()를 사용하여 값을 얻으면 html을 제외하고 얻은 텍스트가 됩니다
3. 속성 설정
$("button:gt( 0)").attr("disabled", "disabled "); //첫 번째 버튼 뒤의 버튼을 가져온 다음 비활성화 속성을 사용할 수 없도록 설정합니다. 이 속성이 없으면 정의되지 않은 값이 반환됩니다.
$("img ").attr({ src: "test.jpg" , alt: "테스트 이미지" });
3.1. 속성 삭제
$("img").removeAttr("src ");
4. 클래스 수정, 존재하는 경우(존재하지 않는 경우) 클래스를 삭제(추가)합니다.
$(
function() {
$("div>p").mouseover(
function() {
$(this).toggleClass("HightLight");//스타일 클래스 수정
}
) ;
}
4.1. 클래스 제거
$("p").removeClass("selected")
4.2. ).addClass( "selected");
5. 사진 복사
$("img:eq(0)").clone().appendTo($("p")); 첫 번째 사진
6. 이벤트 바인딩, 여러 개의 동일한 이벤트를 바인딩할 수 있습니다
$(function() {
$("img").bind("click", function() { //바인딩 이벤트
alert("Click! 1");
});
$("img").bind("click", function() { //바인딩 이벤트
alert("Click! 2");
}); })
7. 이벤트 제거
$("input[type=button]").click(function() {
$("img").unbind("click", eventImg );//바인딩 해제하여 메소드
})
})
요소 표시 및 숨기기
코드 복사
코드 복사
$("#Button4").click(function( ) {
$("# imgs").fadeOut(5000);
})
2. 슬라이드업() 및 슬라이드다운() 메소드로 구현됨
코드 복사
$("#Button2").click(function() {
$("#imgs ").slideDown(5000);
});
3. Jquery 기능 함수
1. 브라우저 감지 $.browser, 다음과 같습니다.
코드 복사
2. 박스 모델 $.boxModel은 다음과 같습니다.
Alert($.boxModel ? "standard" : "IE") 3. javascript 객체 처리 $.each(arr,function) //배열의 경우 각 객체는 다음과 같이
함수 함수로 처리됩니다.
코드 복사
코드는 다음과 같습니다.
$.grep(Arr,funtion(value)):Filter
예:
코드 복사
코드는 다음과 같습니다.
var aArray = [1, 2, 3, 4, 5, 6, 7, 8, 9]; var DemoArr = $.grep(aArray , function(value) { 반환 값 > 4; }); write(DemoArr.join()); $.map(Array,function(value,index) )
이 글은 모두 그 해의 학습 노트에서 파생되었습니다.
요약
Jquery 라이브러리에는 많은 기능이 있으며 그 중 특히 Jquery의 Ajax는 매우 중요합니다. 이 글은 그 시절 Jquery를 배우던 시절을 회상합니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
