Question

我正在尝试在调用函数并将它们存储在数组中时动态添加类，然后为数组中的每个项目创建jQuery对象（将在.clone（）中进一步使用它）。但是，jQuery对象将返回未定义状态。我想念什么？

JS：

jQuery.fn.cloneInfo = function (myClasses) {
            $this = jQuery(this);
            myClassArray = [];


            var splitClasses = myClasses.split(' ');
            jQuery.each(splitClasses, function(){
                myClassArray.push(this);    
            });



            var i;
            for (i = 0; i < myClassArray.length; i++) {
                thisClass = myClassArray[i];
                alert(thisClass); //THIS RETURNS .my-class-1 & .my-class-2
                $thisClone = jQuery(thisClass);
                alert($thisClone.attr('class')); //THIS RETURNS UNDEFIENED
            }
        }

        jQuery('.wrap').on('click', '#button', function(e) {
        e.preventDefault();
            $this = jQuery(this);
            jQuery(this).cloneInfo('.my-class-1 .my-class-2');

        });

Answer 1

本质上看来，这些是目标：

单击一个按钮：

$('button').on('click', function() {...});

将多个类添加到给定的集合中（在OP中这部分含糊）
```
$(collection).addClass(cList)
```
返回一个数组（关于该数组的组成，OP尚不清楚）
```
$(collection).toArray()
```

因此，如果所有假设都正确：

$('button').on('click', function() {
  var cArr = $(collection).addClass(cList).toArray();
  console.log(cArr)'
});

以下演示是上面代码的可重用插件。该插件包装在click事件处理程序中，而不是在插件本身中包含事件处理程序。

插件......： .classArray()
签名：：$(collection).classArray(cList);
参数
收藏 [[String]：任何有效的选择器
cList [[DOMTokenString]：以空格分隔的className列表
注意：CSS是可选的，不是必需的。

$.fn.classArray = function(cList) {
  this.addClass(cList);
  return this.toArray();
}

$('button').on('click', function() {
  var cArr = $('li, p, a').classArray('c1 c2');
  //var cArr = $('li, p, a').addClass('c1 c2').toArray();
  console.log(cArr);
});

*:after {
  content: ' 'attr(class)
}

.as-console-wrapper {
  width: 60%;
  margin-left: 40%
}

.as-console-row.as-console-row::after {
  content: '';
  padding: 0;
  margin: 0;
  border: 0;
  width: 0;
}

<header>
  <button>classArray</button>
</header>
<main>
  <header>
    <nav>
      <ol>
        <li><a href='#/'>LINK</a></li>
        <li><a href='#/'>LINK</a></li>
        <li><a href='#/'>LINK</a></li>
      </ol>
    </nav>
  </header>
  <article>
    <h1>MAIN TITLE</h1>
    <p>CONTENT</p>
  </article>
</main>
<footer></footer>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

在具有类名称的数组的for循环内创建jQuery对象

1 个答案: