javascript - 使用 Prototype 或 jQuery 实现 .lastChild 的最佳方式

Question

目前我们使用 prototype 和 jQuery 作为我们的 js 框架。现在，jQuery 设置为 $j() 以防止原型(prototype)冲突。

过去，我们大量使用原型(prototype)的 Element.down()、Element.next() 和 Element.previous() 来遍历 DOM。但是，我需要一种简单的方法来检索最后一个子元素。我知道我可以使用 Element.childElements() 遍历一个数组，但我想要一些内联的东西，它可以清晰地读取并且可以进行流水线处理。

只是想在重新发明轮子之前先问一下。下面是一段代码，其中包含需要替换的 lastChild:

_find : function(rows, address) {
        var obj = null;
        for (var i=0; i < rows.length && obj == null; i++) {
            if (rows[i].down().className == 'b')
                obj = this._find(rows[i].lastChild.down().down().childElements(), address);
            else if (rows[i].lastChild.getAttribute('tabAddress') == address)
                return rows[i].lastChild;
        }
        return obj;
    }

Answer 1

伙计们，请注意选择器函数返回元素数组(而不是单个元素)，因此您必须按索引 [0] 添加结果数组中的元素。

原型(prototype)中的代码

//if you only have the id of the parent
var lastChild = $$("#parent :last-child")[0]; 
//or
//if you have the actual DOM element
var lastChild = $(element).select(":last-child")[0]; 

Jquery 中的代码

//if you only have the id of the parent
var lastChild = $("#parent :last-child")[0]; 
//or
//if you have the actual DOM element
var lastChild = $(":last-child", element)[0]; 

普通 javascript 代码

var element = document.getElementById("parent");
var lastChild = element.childNodes[element.childNodes.length - 1];

另请注意，如果父元素没有子节点，这些可以返回 null。

• Some info on the CSS :last-child selector