如何扩展jQuery以便更容易检索tagName

Question

我希望扩展jQuery,以便我可以轻松地检索jQuery对象中第一个元素的tagName.这是我提出的,但它似乎不起作用:

$.fn.tagName = function() {
    return this.each(function() {
        return this.tagName;
    });
}
alert($('#testElement').tagName());

有什么想法有什么不对吗？

顺便说一句,我希望将它用于测试而不是生产.

Answer 1

试试这个:

$.fn.tagName = function() {
    return this.get(0).tagName;
}
alert($('#testElement').tagName());

为了解释为什么原始示例不起作用的原因,该each()方法将始终返回原始jQuery对象(除非jQuery对象本身被修改).要查看每个代码中发生的情况,下面是一些伪代码,它显示了该each()方法的工作原理:

function each(action) {
    for(var e in jQueryElements) {
        action();
    }
    return jQueryObject;
}

这不是each()真正实现的方式(可能是长镜头),但它是为了表明action()忽略函数的返回值.

Answer 2

为什么要创建一个插件？似乎有点不必要......

alert( $('div')[0].tagName );

Answer 3

您可能希望添加toLowerCase()以使其更加一致(并且符合XHTML).

$.fn.tagName = function() {
    return this.get(0).tagName.toLowerCase();
}

alert($('#testElement').tagName());