>웹 프론트엔드 >JS 튜토리얼 >jQuery 속성 및 CSS 작업

jQuery 속성 및 CSS 작업

黄舟
黄舟원래의
2016-12-15 14:57:41984검색

속성
1. 속성
1.1 attr(name|PRoperties|key,value|key,fn)
1) 속성 값 가져오기 $("img").attr("src");
2) 속성 값 설정 $("img").attr("title","Hello");$("img").attr({src:"img1.png",alt:"img1" } )
3) 속성 값 설정 $("img").attr("alt",function(index,value){return value + index}) //index는 현재 요소의 인덱스, 값은 "alt " 원래 속성 값
1.2 RemoveAttr(name)
속성 삭제 $("img").removeAttr("alt");
1.3 prop(name|properties|key,value|key,fn)
       $("input[type='checkbox']").prop("checked", true);
        $("input[type='checkbox']").prop("checked", function ( i, val ) { return !val; });
1.4 RemoveProp(name)
.prop() 메소드에 의해 설정된 속성을 삭제하는 데 사용됩니다.
1.5 attr()과 prop의 차이점 ()
체크, 선택, 비활성화 등 true와 false 두 가지 속성을 갖는 속성은 prop()을 사용하고, 그 외는 attr()을 사용합니다.
2. CSS 클래스
2.1 addclass(class|fn)
$("p").addClasss("활성 포커스");
  $("ul li").addClass(function(i,class){return class+i})
2.2 RemoveClass([name | fn])
$("p").removeClass("active");
$("p").removeClass(function(){return $(this).attr("class")} )
2.3 토글클래스(클래스|fn)
$("p").toggleClass("active");
$(".class").toggleClass(function(){
if( $ (this).parent().is(".myClass"))
                                                                                    > ~                                                                                  요소의 HTML 콘텐츠
콘텐츠 $("div")를 설정합니다. html("< ;p>htmlhtmlhtml

");
$("div").html(function(index,html){return html+index})
3.2 텍스트 ([val|fn])
콘텐츠 가져오기 $("p").text()
콘텐츠 설정 $(" p").text("texttexttext")
                                                                 $(" input").val();
값 설정 $("input").val("2222222");
$("input").val(function(index, value){return index + value })
확인/선택 값 //배열 연산
$("input").val(["check2", "radio1"]);
CSS
1.css
1.1 CSS(이름|프로|[,val|fn])
스타일 속성 값을 가져옵니다. ~                                             $("p") .css({color:"red",width:"100px"})
                       ~ | }. > 1.2 jQuery.cssHook
2. 위치
2.1 offset([coordinates] ) 현재 뷰포트에서 일치하는 요소의 상대 오프셋을 가져옵니다.
오프셋 값을 가져옵니다. $("p").offset()
오프셋 값을 설정합니다. $("p").offset({위쪽:100, 왼쪽:100})
                                                                              >
뉴스포스 반환 ;
})
2.2 position()은 부모 요소를 기준으로 일치하는 요소의 오프셋을 가져옵니다.
$("p").position()
2.3 scrollTop([val]) 스크롤 막대 상단을 기준으로 일치하는 요소의 오프셋을 가져옵니다.
Get $("p").scrollTop()
Set $("p").scrollTop(500)
2.4 scrollTop([val]) 상단을 기준으로 일치하는 요소의 오프셋을 가져옵니다. 스크롤 막대의
$("p").scrollLeft() 가져오기
$("p").scrollLeft(500) 설정
3. 크기
높이 3.1([val|fn])
$("p").height() 가져오기
$("p").height(500)
설정 $("p").height(function(i,c){return c+200; })
3.2 width([val|fn])
Get $("p").width()
Set $("p").width(500)
$(" p ").width(function(i,c){return c+200;})
3.3 innerHeight() 첫 번째로 일치하는 요소(패딩 포함 및 테두리 제외)의 내부 영역 높이를 가져옵니다. >                                                          $("p").innerHeight(); ~3.5 externalHeight([options]) 첫 번째로 일치하는 요소의 외부 높이를 가져옵니다(기본값에는 패딩과 테두리가 포함됨).
                                                              옵션 값이 true이고 기본값이 false인 경우 계산에 여백(margin)을 포함하여 사용  
  3.6 externalWidth([options]) 가져오기 첫 번째로 일치하는 요소의 외부 너비(패딩 및 테두리 포함) 기본적으로).
옵션 값이 true인 경우 마진이 계산에 포함됩니다. 기본값은

입니다. 위는 jQuery 속성 및 CSS 작업에 대한 내용입니다. PHP 중국어 홈페이지(www.php.cn)로!

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