JS / jQuery - 在每个（） - 函数中扩展Var

Question

我有两种格式的列表：

<ul id="filters" class="option-set button-group" data-filter-group="kategorie">
    <li>
        <a href="#" data-filter=".corporatedesign">Corporate Design</a>
    </li>
    <li>
        <a href="#" data-filter=".webdesign">Webdesign</a>
    </li>
</ul>

在Javascript中有一个点击功能可以将“isotopeactive”类添加或删除到link-element：

$('#filters a').click(function(){
    var $this = $(this);                
    if ( $this.hasClass('isotopeactive') ) {
        $this.removeClass('isotopeactive');
    }else{
        $this.addClass('isotopeactive');
    }

问题是将所有数据过滤器 - 来自“同位素”的所有元素的数据转换为一个变量。我的第一次尝试是这样，但它不起作用..

var filterValue = '';
var i = 0;  

$( ".isotopeactive" ).each(function() {
    filterValue += $this.attr('data-filter');
    i++;
});

最后我想得到这样的东西： filterValue =＆gt; “.corporatedesign .webdesign”

有什么建议吗？谢谢！ ：）

Answer 1

我建议：

var data = $('.isotopeactive').map(function(){
             return this.dataset.filter;
           }).get();

对于那些没有实现dataset的旧版浏览器：

var data = $('.isotopeactive').map(function(){
             return this.getAttribute('data-filter');
           }).get();

或者：

var data = $('.isotopeactive').map(function(){
             return $(this).data('filter');
           }).get();

这会将一组值返回给data变量。

参考文献：

• JavaScript的：
  • Element.getAttribute()。
  • HTMLElement.dataset。
• jQuery的：
  • data()。
  • get()。
  • map()。