JQuery Inner ohne Unterelement

Question

Ich frage mich, wie ich, ohne sich um den Text seiner Kinder den Text einer verschachtelten Listenposition erhalten würde, dh

<ul> 
    <li id="node"> 
     I want this 
    <ul> 
     <li> 
      I dont want this 
     </li> 
    </ul> 
    </li> 
</ul> 

Jetzt mit $ (‚# Knoten‘). Text mit jquery() bekommt mir allen Text, wo ich doch nur die "Ich möchte diese" Zeichenfolge haben möchte.

Jede Hilfe wird geschätzt.

Prost, Chris.

Answer 1

ein Text Children Plugin für diese gibt es, wenn es etwas ist, Sie oft tun wollen werden. Es bietet Ihnen auch einige Optionen für die Ausgabe.

Answer 2

Im Folgenden finden Sie eine verkettete Zeichenfolge aller Textknoten erhalten, die direkte Kinder eines Knotens sind:

function getChildText(node) { 
    var text = ""; 
    for (var child = node.firstChild; !!child; child = child.nextSibling) { 
    if (child.nodeType === 3) { 
     text += child.nodeValue; 
    } 
    } 
    return text; 
} 

alert(getChildText(document.getElementById("node"))); 

Answer 3

Tims Lösung wird funktionieren. Wenn Ihr Markup immer in diesem Format festgelegt ist, und Sie müssen nur den ersten Abschnitt des Textes bis zu dem Kind Element lesen, könnten Sie sogar weg mit einfach:

node.firstChild.data 

Answer 4

Dieses Beispiel .contents() nutzt alle Kinder zu bekommen Knoten (einschließlich Textknoten) und verwendet dann .map(), um jeden untergeordneten Knoten basierend auf der nodeType in eine Zeichenfolge umzuwandeln. Wenn der Knoten ein Textknoten ist (d. H. Text nicht innerhalb der <li>), geben wir nodeValue zurück.

Dies gibt einen jQuery-Satz zurück, der Strings enthält, also rufen wir .get() auf, um ein 'Standard'-Array-Objekt zu erhalten, das wir .join() aufrufen können.

// our 'div' that contains your code: 
var $html = $('<li id="node">I want this<ul><li>I dont want this</li></ul> </li>'); 

// Map the contents() into strings 
$html.contents().map(function() { 
    // if the node is a textNode, use its nodeValue, otherwise empty string 
    return this.nodeType == 3 ? this.nodeValue : undefined; 
    // get the array, and join it together: 
}).get().join(''); 

// "I want this " -- note the extra whitespace from after the <ul> 

Und ein einfacher Anruf zu machen:

$.fn.directText=function(delim) { 
    if (!delim) delim = ''; 
    return this.contents().map(function() { return this.nodeType == 3 ? this.nodeValue : undefined}).get().join(delim); 
}; 

$html.directText(); 
// "I want this " 

Oder eine etwas robustere Version Leerzeichen/Ändern der Verbindungszeichenfolge zu ermöglichen Besatz:

$.fn.directText = function(settings) { 
    settings = $.extend({},$.fn.directText.defaults, settings); 
    return this.contents().map(function() { 
    if (this.nodeType != 3) return undefined; // remove non-text nodes 
    var value = this.nodeValue; 
    if (settings.trim) value = $.trim(value); 
    if (!value.length) return undefined; // remove zero-length text nodes 
    return value; 
    }).get().join(settings.joinText); 
}; 

$.fn.directText.defaults = { 
    trim: true, 
    joinText: '' 
};