jquery를 클릭하여 요소 클래스 이름을 수정하는 방법

jquery는 다음을 클릭하여 요소의 클래스 이름을 수정하는 방법을 구현합니다. 1. 클릭 이벤트를 요소에 바인딩하고 이벤트 처리 함수를 지정합니다. 2. 이벤트 처리 함수에서 attr() 메서드를 사용하여 클래스를 수정합니다. 요소의 이름입니다. 구문은 " $(selector).attr('class','new class name');"입니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, jquery 버전 1.10.0, Dell G3 컴퓨터.

jquery가 한 번의 클릭으로 요소 클래스 이름을 수정하는 방법

1. div 요소를 작동하는 데 사용되는 파일 이름 test.html로 새 HTML 페이지를 만듭니다. html 페이지에 jquery.min.js 파일을 로드합니다. 이 파일은 jquery의 모든 메소드를 통합합니다. 파일이 성공적으로 로드된 경우에만 jquery의 메소드를 사용할 수 있습니다. HTML 페이지에 새 div 요소를 만들고 클래스 이름을 red로 지정합니다.

클릭 후 확실한 효과를 얻기 위해 CSS를 통해 class="red"인 div의 배경색을 빨간색으로 정의하고, 클래스 이름이 검정색인 경우 배경색도 검정색으로 정의합니다.

2. onclick 이벤트가 발생하면 div의 클래스를 변경하는 데 주로 사용됩니다.

change_color()에서 div 요소의 클래스를 변경하는 코드를 작성하여 div를 클릭하면 class="red"가 class="black"으로 변경되어 클래스 이름 변경 기능을 구현합니다. 주로 jquery의 attr() 메소드를 통해 클래스의 클래스 이름이 변경됩니다.

코드를 실행하고 브라우저에서 결과를 확인하세요.

div를 클릭하여 클래스 이름을 변경하는 기능이 구현되어 있는 것을 볼 수 있습니다.

추천 관련 비디오 튜토리얼: jQuery 비디오 튜토리얼

위 내용은 jquery를 클릭하여 요소 클래스 이름을 수정하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!