jquery가 html 태그 스타일을 변경하는 방법(두 가지 구현 방법)_jquery

html 태그를 수정하는 방법은 js의 경우 setAttribute를 통해 태그의 속성을 설정하고 getAttribute를 통해 태그의 속성을 가져올 수 있습니다. 물론 jq에서도 비슷한 기능을 얻을 수 있습니다. .
라벨 속성을 수정하여 스타일 변경
js가 라벨의 속성을 설정하고 가져옵니다

코드 복사 코드는 다음과 같습니다.

　

jq는 태그의 속성을 설정하고 가져옵니다

코드 복사 코드는 다음과 같습니다.

JS의 window.onload 메소드 블록의 내용은 JQ의 $(function( ){}) method block 이후 다시 실행합니다.
CSS 스타일을 수정하여 라벨 스타일 변경
기본 구문 살펴보기:

코드 복사 코드는 다음과 같습니다:

$("#attr").addClass("banner");//스타일 추가
$("#attr") .removeClass( "banner");//스타일 제거
　　　　　　　　　//JQ는 공동 작성을 지원합니다. 왜냐하면 RemoveClass의 반환 결과도 Jq 객체이므로 Jq 객체의 모든 메서드와 이벤트를 사용할 수 있기 때문입니다
$ ("#attr ").removeClass("banner").addClass("bannerOver");

다음은 dd 라벨을 클릭했을 때 현재 dd 블록을 강조 표시하는 예입니다

코드 복사 코드는 다음과 같습니다.

코드 복사

코드는 다음과 같습니다. .odd { 배경: #808080; } .even { 배경: #ffd800; } .selected { 배경: #0094ff; }　 .hover { 배경: #808080; 🎜 >

코드 복사

코드는 다음과 같습니다. var $trs = $("# menu_title>dd"); //모든 행 선택 $trs.filter(":odd").addClass("odd") //홀수 행에 홀수 스타일 추가 $trs.filter(":even" ).addClass( "even"); //짝수 행에 홀수 스타일 추가 행을 클릭한 후 현재 행을 강조 표시합니다

코드 복사

코드는 다음과 같습니다. //색 변경 스타일을 추가하려면 행을 클릭하세요. $trs.click( function(e) { $(this).addClass("selected") 　　　.siblings()　　　　.removeClass("selected")

마우스 입주 및 퇴장 이벤트 추가

코드 복사 코드는 다음과 같습니다.

　　　 // 마우스 이동
$("#menu_title>dd").hover(
function () {
$(this).addClass("hover");
},
function ( ) {
$(this).removeClass("hover");
}
)

그럼 스타일에 대해 이야기해 보겠습니다. 태그를 제어하세요. 읽어주셔서 감사합니다!