Question

JSLint抛出以下错误，我不确定如何解决：

错误：不要在循环中声明变量。

行：var text = item.innerText || item.textContent

我的问题是我如何获得对innerText或textContent的支持，并在循环遍历元素时使用正确的方法？

这是我的例子。我正在写文本旁边的元素类。我想得到相同的结果，但是测试for循环之外的innerText或textContent。

HTML：

<p class="test">1</p>
<p class="test">2</p>
<p class="test">3</p>

JavaScript的：

(function () {
  'use strict';
  var list = $('.test');

  for (var i = 0, item; item = list[i]; i++) {

    if (i === 1) {
        //Add new class attribute.
        item.className = item.className + ' hello';
    };

    var text = item.innerText || item.textContent

    item.innerHTML = text + ' ' + item.className;

  };

}());

Answer 1

您必须在for循环之外声明var text才能通过此测试。

(function () {
  'use strict';
  var list = $('.test'),
      text; // text is declared here.

  for (var i = 0, item; item = list[i]; i++) {
    if (i === 1) {
        //Add new class attribute.
        item.className = item.className + ' hello';
    };

    text = item.innerText || item.textContent

    item.innerHTML = text + ' ' + item.className;
  };
}());

此外，这里有一个资源丰富的链接，可能会回答为什么jsLint要求您在顶部声明变量：JSLint error: Move all 'var' declarations to the top of the function

Answer 2

在循环外声明变量，并将其分配到循环内。

(function () {
  'use strict';
  var list = $('.test');
  var text;

  for (var i = 0, item; item = list[i]; i++) {

    if (i === 1) {
        //Add new class attribute.
        item.className = item.className + ' hello';
    };

    text = item.innerText || item.textContent

    item.innerHTML = text + ' ' + item.className;

  };

}());

测试内部循环中的innerText或textContent

2 个答案: