Program Tip

요소에서 두 번째 클래스 이름을 얻는 방법은 무엇입니까?

programtip 2020. 12. 3. 19:09
반응형

요소에서 두 번째 클래스 이름을 얻는 방법은 무엇입니까?


클래스 속성의 두 번째 클래스 이름을 검색하는 방법을 찾으려고합니다.

예를 들면 다음과 같습니다.

<div class="something fooBar"></div>

"fooBar"라는 두 번째 클래스를 어떻게 얻을 수 있습니까?

특정 클래스를 추가, 제거 및 확인할 수 있다는 것을 알고 있지만 두 번째 클래스를 변수로 검색하는 방법에 대한 설명서를 찾을 수 없습니다.


다음 split과 같이 사용할 수 있습니다 .

alert($('#divID').attr('class').split(' ')[1]);

모든 수업을 얻으려면 대신 다음을 수행 할 수 있습니다.

var classes = $('#divID').attr('class').split(' ');

for(var i=0; i<classes.length; i++){
  alert(classes[i]);
}

더 많은 정보:


// alerts "8"
alert($('<div class="something 8"></div>').attr('class').split(' ')[1]);

이것은 div ID를 참조하여 수행하는 방법입니다.

$(document).ready( function () {
  alert($('#yourDivID').attr('class').split(' ')[1]);
});

분할 기능을 사용하면 지정된 구분 기호로 문자열을 분할 할 수 있습니다. 이렇게하면 분리 된 값의 배열이 반환됩니다. 이 경우 클래스 이름 배열을 반환합니다.

다른 문자열 메소드 분할에 대한 참조 http://www.javascriptkit.com/javatutors/string4.shtml

클래스에 액세스하려면 다음 jQuery 선택기와 함수를 살펴 봐야합니다.

선택자

http://api.jquery.com/class-selector/ 지정된 클래스가있는 dom 요소 선택

http://api.jquery.com/has-selector/ 지정된 선택기가있는 dom 요소 선택

기능

http://api.jquery.com/addClass/ 메소드를 사용하여 jQuery 객체에 클래스를 추가합니다.

http://api.jquery.com/removeClass/ 메소드를 사용하여 jQuery 객체에 대한 클래스를 제거합니다.

http://api.jquery.com/toggleClass/ 메소드를 사용하여 클래스를 jQuery 객체로 전환

http://api.jquery.com/hasClass/ 메소드를 사용하여 jQuery 객체에 지정된 클래스가 있는지 확인

http://api.jquery.com/attr/ 메소드를 사용하여 jQuery 객체의 속성을 검색합니다.

수정 됨 : 멋진 치트 시트

여기에 이미지 설명 입력


대안으로 상태를 추적하기 위해 data- * html 속성을 사용하는 것이 항상 더 나은 방법입니다 (예 : $ ( "div.example"). data ( "active")).


클래스 속성의 값을 가져와 공간에서 분할 할 수 있습니다.

secondClass = element.className.split(' ')[1];

이것은 올바르지 않습니다. 클래스가 두 개 이상의 공백을 분리하고 두 번째 클래스가 있으면 비어 있습니다. 예:

<div class="something   fooBar"></div>
var classes = $('div').attr('class').split(' ');
alert('classes: ' + classes + '; length: ' + classes.length );
// classes: something,,,fooBar; 4 

다음 코드를 사용합니다.

/*
 *   el  - element
 *   num - class number
 */
function getNumClass(el, num) {

  var classes = el.split(' ');
  var newclasses = [];
  var ret;

  for (var i = 0; i < classes.length; i++) {

    ret = $.trim(classes[i]);
    if(ret.length > 0) {
      newclasses.length += 1;
      newclasses[newclasses.length-1] = ret;
    }
  }

  if (num > newclasses.length) return false;

  return newclasses[num - 1];
}

참고 URL : https://stackoverflow.com/questions/4239947/how-to-get-the-second-class-name-from-element

반응형