내가 샘플 코드가

-1

목록 리에서 모든 값을 얻는 방법 :내가 샘플 코드가

<ul id="classList"> 
<li class="visibleLayer" data-attr="1">Class 1</li> 
<li class="" data-attr="2">Class 2</li> 
<li class="visibleLayer" data-attr="3">Class 3</li> 
<li class="" data-attr="4">Class 4</li> 
</ul> 
<a href="javascript:;" onclick="getList();">Get</a>

내 자바 스크립트 :

function getList() { 
    classAdder = document.getElementById('classList'); 
    ... 
}

=> 수업이있는 모든 데이터 ATTR를 얻는 방법 are visibleLayer

출처

2015-01-30 Hai Truong IT

jQuery를, 자바 스크립트 또는 모두 괜찮아? –

너는 $.fn.map, $.fn.get 및 일부 기본 선택자. [attr-name[=attr-value]]은 속성의 CSS 선택 자이고 .className은 클래스의 CSS 선택자입니다.

우리는 둘을 결합하고 $.fn.map 및 $.fn.get을 사용하여 속성 배열을 반환합니다.

var attrs = $('[data-attr].visibleLayer').map(function(){ 
    return $(this).data("attr"); 
}).get();

출처

2015-01-30 07:58:13

당신은 요소 컬렉션을 얻을 수 querySelectorAll()를 사용하여 다음 data-attr 속성 얻을 for 루프를 반복.

JSFiddle

출처

2015-01-30 08:00:36 potashin

function getList(){ 
    var li = document.querySelectorAll('#classList li[class=visibleLayer]') 
    for(var i = 0; i < li.length ; i++) 
     console.log(li[i].getAttribute('data-attr')) 

}

당신이 할 수 있었던 ul을 통해 루프와 아이들이 필요한 클래스가 있는지 확인하세요.

$('#classList').children('li').each(function() { 
    if($(this).hasClass("visibleLayer")) { 
     console.log($(this).data("attr")); 
    } 
})

DEMO

출처

2015-01-30 08:00:54 Aditya

당신은 필요한 클래스와 리튬을 필터링 filter을 사용할 수 있습니다

$('#classList li[class=visibleLayer]').filter(function() { 
    alert($(this).attr('data-attr')); //gives 1 and 3 
});

출처

2015-01-30 08:05:27

function getList() { 
if($('#classList .visibleLayer').length) { 
    $('#classList .visibleLayer').each(function(){ 
     alert($(this).attr('data-attr')); 
    }); 
}

}

데모 : http://jsfiddle.net/vsok/7ptq3677/

출처

2015-01-30 08:07:17

function getList(){ 
 
    var phrases = []; 
 
    $('#classList').each(function(){  
 
    var phrase = ''; 
 
    $(this).find('.visibleLayer').each(function(){ \t \t \t  
 
     phrase = $(this).attr("data-attr"); 
 
     alert(phrase) 
 
    }); \t \t 
 
    phrases.push(phrase); 
 
    }); \t 
 
}

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
 
<html> 
 
    <head> 
 
    <title> Test Page </title> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</head> 
 
    <body> 
 
    <ul id="classList"> 
 
     <li class="visibleLayer" data-attr="1">Class 1</li> 
 
     <li class="" data-attr="2">Class 2</li> 
 
     <li class="visibleLayer" data-attr="3">Class 3</li> 
 
     <li class="" data-attr="4">Class 4</li> 
 
    </ul> 
 
    <a href="javascript:;" onclick="getList();">Get</a> 
 

 
    </body> 
 
</html>

출처

2015-01-30 08:17:31 vickisys

내가 샘플 코드가

답변

관련 문제