1

当我尝试从函数返回对象并将其分配给 smalls 变量时，变量 smalls 为空，因为它的长度返回为 0。

var smalls = function(){
        var table = $("#box-table-a");
        return table.find("small");
    }, smallContent;
    for(var i = 0; i<smalls.length; i++){
        smallContent = smalls[i].innerHTML;
        smalls[i].parentElement.className += "relative";
        smalls[i].className += "form-absolute-right";
        smalls[i].innerHTML = "<span class='bubble'>" + smallContent + "<span>";
    }

虽然这可行，但可变的小物具有所需的长度。

    var table = $("#box-table-a");
    var smalls = table.find("small");       //fetch the tr's with <small> tag
    var smallContent;
    for(var i = 0; i<smalls.length; i++){
        smallContent = smalls[i].innerHTML;
        smalls[i].parentElement.className += "relative";
        smalls[i].className += "form-absolute-right";
        smalls[i].innerHTML = "<span class='bubble'>" + smallContent + "<span>";
    }

根据我对 Javascript 的了解，可以将函数分配给变量。我究竟做错了什么？

4

4 回答 4

3

你忘了在smalls这里执行

var smalls = function(){
        var table = $("#box-table-a");
        return table.find("small");
    }, smallContent;
    for(var i = 0; i<smalls.length; i++)
//                   ^smalls is a function pointer

var smalls = function(){
            var table = $("#box-table-a");
            return table.find("small");
        }(), smallContent;
//       ^execute the function
        for(var i = 0; i<smalls.length; i++)
//                       ^smalls is a nodeList
于 2012-07-27T10:56:20.790 回答
2

这是因为您必须实际执行该功能，而不仅仅是分配它。将您的函数分配更改为自动执行的匿名函数，这应该可以。

var smalls = (function(){
    var table = $("#box-table-a");
    return table.find("small");
})(), smallContent;
于 2012-07-27T10:54:52.523 回答
2

正如其他人所提到的，您循环的是函数引用，而不是执行的结果smalls。

然而，当您使用 jQuery 时，您可以编写更短/更简单的代码：

var smalls = $("#box-table-a").find("small"); // this var really contains the elements
smalls.addClass("form-absolute-right").wrapInner("<span class='bubble' />");
smalls.parent().addClass("relative");

这有各种优点：

  • 这些类被简单地添加到列表中，您不必担心空格。
  • wrapInner 确实保留了 DOM（以及所有侦听器等），而不是弄乱 html 字符串
  • parent() 遍历方法是唯一的集合，因此具有多个元素的元素table-box只会获得一个类
  • 你根本不需要循环，jQuery 方法在集合中的每个项目上执行。
于 2012-07-27T11:12:43.433 回答
0

尝试

var smalls = function(){
    var table = $("#box-table-a");
    return table.find("small");
}, smallContent;
for(var i = 0; i<smalls().length; i++){
    smallContent = smalls()[i].innerHTML;
    smalls()[i].parentElement.className += "relative";
    smalls()[i].className += "form-absolute-right";
    smalls()[i].innerHTML = "<span class='bubble'>" + smallContent + "<span>";
}

因为如果没有调用整个函数，就永远不会调用 return。

顺便提一句：

$('#box-table-a .small')
    .toggleClass('form-absolute-right',true)
    .wrap('<span class="bouble" />')
    .parent()
    .toggleClass('relative',tru);

可能会更好。

于 2012-07-27T10:54:42.460 回答