jQuery的.text()在内部是如何工作的?

时间:2011-02-16 23:22:57

标签: javascript jquery

我很快就试图在jQuery的源代码中找到实现,但只找到this,它实际上似乎并没有完全定义它。

来自jQuery Source

jQuery.fn.extend({
    text: function( text ) {
        if ( jQuery.isFunction(text) ) {
            return this.each(function() {
                return jQuery(this).text( text.call(this) );
            });
        }

        if ( typeof text !== "object" && text !== undefined ) {
            return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );
        }

        return jQuery.getText( this );
    },

有人知道吗?

澄清:
我知道如何使用它。我只是想知道当jQuery不可用时如何获取jQuery元素的文本。

5 个答案:

答案 0 :(得分:10)

var text = element.innerText || element.textContent;

示例: http://jsfiddle.net/XnL7H/1/

答案 1 :(得分:10)

jQuery.fn.text可以用于3个不同的目的,因为您粘贴的源清楚地显示。您正在寻找的案例是第三个案例 - 返回元素的文本值。

jQuery使用jQuery.text()方法获取元素的文本值,jQuery.text指向Sizzle.getText()

jQuery.text = Sizzle.getText;

这是getText函数的定义。

// Utility function for retreiving the text value of an array of DOM nodes
Sizzle.getText = function( elems ) {
    var ret = "", elem;

    for ( var i = 0; elems[i]; i++ ) {
        elem = elems[i];

        // Get the text from text nodes and CDATA nodes
        if ( elem.nodeType === 3 || elem.nodeType === 4 ) {
            ret += elem.nodeValue;

        // Traverse everything else, except comment nodes
        } else if ( elem.nodeType !== 8 ) {
            ret += Sizzle.getText( elem.childNodes );
        }
    }

    return ret;
};

工作示例:http://jsfiddle.net/cBsDN/

答案 2 :(得分:2)

它使用Sizzle getText方法:

// Utility function for retreiving the text value of an array of DOM nodes
Sizzle.getText = function( elems ) {
    var ret = "", elem;

    for ( var i = 0; elems[i]; i++ ) {
        elem = elems[i];

        // Get the text from text nodes and CDATA nodes
        if ( elem.nodeType === 3 || elem.nodeType === 4 ) {
            ret += elem.nodeValue;

        // Traverse everything else, except comment nodes
        } else if ( elem.nodeType !== 8 ) {
            ret += Sizzle.getText( elem.childNodes );
        }
    }

    return ret;
};

http://sizzlejs.com/

答案 3 :(得分:0)

假设您知道如何使用jQuery获取JavaScript中的元素。

var el = document.getElementById("my-element");

然后您只需使用两个可用于每个元素innerTextinnerHTML的属性。所以要获得你使用的文字:

var text = el.innerText;

或者要获取HTML,您可以:

var html = el.innerHTML;

答案 4 :(得分:0)

如果你知道createTextNode和createElement的不同,你就可以理解如何使用jquery.text。

文本函数创建DOM文本节点。浏览器将节点的值作为文本。

相关问题