[javascript] jQuery를 사용하여 클래스 이름 가져 오기

jQuery를 사용하여 클래스 이름을 가져오고 싶습니다.

그리고 ID가 있다면

<div class="myclass"></div>



답변

클래스가 아닌 다른 수단을 통해 요소를 jQuery 객체로 가져온 후

var className = $('#sidebar div:eq(14)').attr('class');

트릭을해야합니다. ID는을 사용하십시오 .attr('id').

이벤트 핸들러 또는 다른 jQuery 메소드 내에있는 경우 요소가 랩퍼가없는 순수한 DOM 노드 인 경우 다음을 사용할 수 있습니다.

this.className // for classes, and
this.id // for IDs

둘 다 표준 DOM 메소드이며 모든 브라우저에서 잘 지원됩니다.


답변

.hasClass()요소에 특정 요소가 있는지 확인하려는 경우 사용하는 것이 좋습니다 class. 요소가 여러 개일 때 class확인하기가 쉽지 않기 때문 입니다.

예:

<div id='test' class='main divhover'></div>

어디:

$('#test').attr('class');        // returns `main divhover`.

로 클래스가 .hasClass()있는지 테스트 할 수 있습니다 .divdivhover

$('#test').hasClass('divhover'); // returns true
$('#test').hasClass('main');     // returns true


답변

조심해야 할 것입니다. 아마도 클래스와 하위 클래스가있을 것입니다.

  <div id='id' class='myclass mysubclass' >dfdfdfsdfds</div>

이전 솔루션을 사용하면 다음과 같은 이점이 있습니다.

myclass mysubclass

따라서 클래스 선택기 를 사용하려면 다음을 수행하십시오.

var className = '.'+$('#id').attr('class').split(' ').join('.')

그리고 당신은 할 것이다

.myclass.mysubclass

이제 위의 div와 같은 클래스를 가진 모든 요소를 ​​선택하려면 다음을 수행하십시오.

   var brothers=$('.'+$('#id').attr('class').split(' ').join('.'))

그 의미는

var brothers=$('.myclass.mysubclass')

2018 업데이트

또는 두 줄로 바닐라 자바 ​​스크립트로 구현할 수 있습니다.

  const { classList } = document.querySelector('#id');
  document.querySelectorAll(`.${Array.from(classList).join('.')}`);


답변

이것은 요소를 사용하여 두 번째 클래스를 여러 클래스로 가져 오는 것입니다.

var class_name = $('#videobuttonChange').attr('class').split(' ')[1];


답변

간단하게 사용할 수 있습니다.

var className = $('#id').attr('class');


답변

당신이 만약 <div>있다 id:

​<div id="test" class="my-custom-class"></div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

…당신은 시도 할 수 있습니다:

var yourClass = $("#test").prop("class");

에 ( <div>이) 만있는 class경우 다음을 시도해보십시오.

var yourClass = $(".my-custom-class").prop("class");


답변

split 함수를 사용하여 클래스 이름을 추출하려는 경우 예상치 못한 결과를 초래할 수있는 잠재적 인 서식 변형을 보상해야합니다. 예를 들면 다음과 같습니다.

" myclass1  myclass2 ".split(' ').join(".")

생산

".myclass1..myclass2."

클래스 이름에 허용되는 문자 세트와 일치시키기 위해 정규 표현식을 사용하는 것이 좋습니다. 예를 들면 다음과 같습니다.

" myclass1  myclass2  ".match(/[\d\w-_]+/g);

생산

["myclass1", "myclass2"]

정규식은 아마도 완전하지는 않지만 내 요점을 이해하기를 바랍니다. 이 방법은 서식이 잘못 될 가능성을 완화합니다.