>웹 프론트엔드 >JS 튜토리얼 >Jquery 기본 학습 Notes_jquery

Jquery 기본 학습 Notes_jquery

WBOY
WBOY원래의
2016-05-16 18:52:081148검색

1. 속성: 일치하는 모든 요소에 대해 계산된 속성 값 설정

//모든 입력에 대한 속성 class="btn" 추가
//$("input").attr("class "," btn");


2. CSS: 지정된 클래스 이름을 일치하는 각 요소에 추가
//모든 제출 버튼에 스타일 추가
$("input :submit").addClass ("btn");


3. 값: 첫 번째로 일치하는 요소의 현재 값을 가져옵니다.
//버튼의 값을 가져옵니다.
/ /alert($("# Button1").val());


4. Html 코드: 첫 번째로 일치하는 요소의 html 콘텐츠를 가져옵니다. 이 기능은 XML 문서와 함께 사용할 수 없습니다. 그러나 XHTML 문서에는 사용할 수 있습니다.
//div 사이의 html 코드 출력
//alert($("#div1").html())

//Div의 html 재할당
// $("#div1").html("");


5. 텍스트: 일치하는 모든 요소의 콘텐츠를 가져옵니다.

결과는 일치하는 모든 요소에 포함된 텍스트 콘텐츠를 결합한 텍스트입니다. 이 방법은 HTML 및 XML 문서 모두에 적용됩니다.


//div 사이의 텍스트 값을 출력
//alert($("#div1").text())

// div 텍스트 재할당
//$("#div1").text("100");

6. //라디오 버튼 선택
$("#select1").val ( "옵션 2");
// if( $("#select1").val()=='옵션 2')
// {
// Alert("옵션 2를 선택하셨습니다. ");
// }

7. 하나 이상의 DOM 요소를 jQuery 객체로 변환
//페이지 배경색 설정
$(document.body).css(" background ","#c0c0c0");

//양식의 모든 요소 숨기기 [사용할 수 없음]
//$(div.elements).hide();

8 , 각 사용법은 일치하는 각 요소를 컨텍스트로 사용하여 함수
// $("button").click(function () {
// $("div").each(function (index , domEle ) {
// // domEle == this
// $(domEle).css("BackgroundColor", "yellow")
// if ($(this).is( "# stop")) {
// $("span").text("Div 인덱스 #에서 중지됨" index);
// return false;
// }
// }) ;
// });

9. 이 함수의 반환 값은 jQuery 객체의 'length' 속성과 일치합니다.
//버튼 수
//alert ($ ("input:submit").size() " 및 " $("input:submit").length)

10. 일치하는 모든 DOM 요소 집합 가져오기
//alert ($( "input").get().reverse());
//일치하는 요소 중 하나를 가져옵니다. num은 어떤 일치 요소를 얻었는지 나타냅니다.
//alert($("input").get(1));

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.